javascript - 为什么我的范围不显示指令？

Question

我正在使用自定义 Controller 创建指令并测试范围。我想测试该指令是否具有我的索引页的范围，但 ng-show 不起作用。

html

<div class="main">
<div ng-controller="rl">

<book-genres></book-genres>
<review-form ng-show="reviewFormCtrl.rating == 1"></review-form>
<input ng-click="reviewFormCtrl.rating = 3" type="button" value="Test" /> 

</div>

</div>

部分:

<div>
    Review Forms : {{ rating }}

</div>

Controller :

myApp.controller('rl', function(){

});

myApp.directive('reviewForm',  function(){
    return {
        restrict: 'E',
        templateUrl: 'partials/review-form.html',
        replace: true,
        scope: true,
        controller: function($scope){
                $scope.rating = 1;
        },
        controllerAs: 'reviewFormCtrl'
    };
});

Answer 1

由于您使用的是 Controller 作为语法(例如 controllerAs: 'reviewFormCtrl')，因此您应该将评级附加到 Controller 而不是范围。

这应该有效

myApp.directive('reviewForm',  function(){
  return {
    restrict: 'E',
    templateUrl: 'partials/review-form.html',
    replace: true,
    scope: true,
    controller: function(){
      this.rating = 1;  //change here
    },
    controllerAs: 'reviewFormCtrl'
  };
});