繁体   English   中英

Angular ng-show未在视图中显示元素

[英]Angular ng-show is not showing the element in the view

我正在尝试在代码中实现一个简单的Angular ng-show,但似乎无法使其正常工作。 我附上下面的代码。

HTML

  <div ng-repeat="question in data.questions track by $index" ng-if="question.visible" class="slide">

  <md-radio-group ng-model="question.selectedAnswer" ng-if="vm.showSliderChecker">
    <md-radio-button ng-repeat="ans in question.answer track by $index" ng-value="ans._id"
                     ng-click="radioBtnClick({qId: question._id, ansId: ans._id})">{{::ans.description}}
    </md-radio-button>
  </md-radio-group>




  <div class="wrapper" ng-show="vm.showSliderChecker">
 <div class="toggle_radio">
<input type="radio" class="toggle_option" id="first_toggle" name="toggle_option" >

<label for="first_toggle" class="widthEighth" ng-repeat="ans in question.answer track by $index" ng-value="ans._id"
                     ng-click="radioBtnClick({qId: question._id, ansId: ans._id}); showSliderClickedMessage()"><p> {{$index+1}} </p></label>


  </div> 

</div>

</div>

角控制器 vm.checkSliderForDisplay = checkSliderForDisplay;

function initController(){
   checkSliderForDisplay();
}

function checkSliderForDisplay() {
  if($stateParams.testType === "Stress_management"){
        vm.showSliderChecker = true;

        console.log("The value of slider checker is true and here's proof ----> ");
        console.log(vm.showSliderChecker);
      }
      else{
        vm.showSliderChecker = false;
        console.log("Alas, the slider checker is just a lot of false advertising and nothing more.");
        console.log(vm.showSliderChecker);
      }
}

initController();

现在这是问题所在:

控制台日志显示在控制台上,但两个div都保持隐藏状态。 我已经在该网站上寻找解决方案,并尝试了一堆组合,以为我错过了一些细节,但似乎可以使它工作。

使用控制器时由于synstax vm是名称,您可以在范围内引用控制器。

如果代码在不同的闭包中运行,例如从控制器构造函数中运行,则可能需要以不同的方式引用它。

看起来该代码段是在Controller构造函数中调用的,因此“ vm”在此处不会是已定义的变量。 您应该使用“ this”代替:

function checkSliderForDisplay() {
  if(this.testType === "Stress_management"){
    this.showSliderChecker = true;

    console.log("The value of slider checker is true and here's proof ----> ");
    console.log(this.showSliderChecker);
  }
  else{
    this.showSliderChecker = false;
    console.log("Alas, the slider checker is just a lot of false advertising and nothing more.");
    console.log(this.showSliderChecker);
  }
}

如果添加"use strict"; 在js文件的顶部,您应该得到一些警告。

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM