Question

我正在尝试更新DOM中打印的范围内的数据。 HTML由指令创建。但它没有更新

HTML代码

df = df[df['name'].isin(['Brand','Color'])]

Javascript代码

<div ng-controller="triggerController">
   <the-click data-values="{{t_text}}"></the-click>
</div>

但点击时html不会更新。为什么呢？

Answer 1

您必须修改脚本，例如：

angular.module('testapp', [])
  .controller('triggerController', ['$scope',
    function($scope) {
      $scope.t_text = 'I am original';
      $scope.clickme = function() {
        $scope.t_text = 'I have been clicked';
      }
    }
  ]).directive('theClick', function() {
    return {
      restrict: 'E',
      scope:true,
      template: '<h1 ng-click="clickme()">{{t_text}}</h1>'
    }
  })

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>
<div ng-app='testapp' ng-controller="triggerController">
  <the-click data-values="{{t_text}}"></the-click>
</div>

Answer 2

    attr.$observe('values',function(){
      scope.sample = attr.values;
    });

尝试此操作，因为您必须观察属性更改。

Answer 3

您正在更新clickme方法中的$ scope值，该方法在回调中调用。然后Angular无法知道您的数据模型是否已更新。您必须使用$ scope。$ apply（）强制角度来刷新视图

$scope.clickme  = function(){
     $scope.t_text   = 'I have been clicked';
     $scope.$apply();
};

Angularjs指令DOM不会更新

3 个答案: