Question

在我的指令中，我有自定义模板并替换现有模板。当自定义模板单击时，我需要更新$scope.index以进行更新。

但它没有用。但是当我控制房产时，一切正常。这样做的正确方法是什么？

这是我的自定义指令：

var myApp = angular.module('myApp', []);

myApp.controller('main', function ($scope) {

  $scope.values = [{"name":"one", "num" : 1}, {"name":"two", "num" : 2}, {"name":"three", "num" : 3}]

  $scope.index = 0;

  $scope.update = function (num) {
    $scope.index = num;
  }

});

myApp.directive("newArray", function ($compile) {

  return {

    scope : {
      value : "=",
      index : "=",
      update:"&"
    },

    link : function (scope, element, attrs) {

      var getTemplate = function (val, index) {

        switch(index) {

          case 0 :
            return $('<div />', {
              class:'red',
               html : "<h1>testing</h1>",
              click : function () {
                console.log(scope.value.num); //works
                scope.update(scope.value.num); //not wroking
              }
            });
            break;

            case 1 :
            return $('<div />', {
              class:'blue',
              html : "<h1>testing</h1>",
              click : function () {
                scope.update(scope.value.num);
              }
            });
            break;

            case 2 :
            return $('<div />', {
              class:'green',
              html : "<h1>testing</h1>",
              click : function () {
                scope.update(scope.value.num);
              }
            });
            break;

        }

      }

      element.html(getTemplate(scope.value, scope.index));
      $compile(element.contents())(scope);
      element.replaceWith(element.contents());

    }

  }

})

Live Demo

Answer 1

在html中更改行

<new-array index='$index' update="update" value='value' ng-repeat="value in values">{{value.name}}</new-array>

到

<new-array index='$index' update="update($index)" value='value' ng-repeat="value in values">{{value.name}}</new-array>

在js改变：

scope.update(scope.value.num);

到

scope.update({num: scope.value.num});

最后改变：

$scope.update = function (num) {
    $scope.index = num;
  }

到

 $scope.update = function (num) {
    $scope.index = num;
    $scope.$apply();
  }

请参阅updated plunker

无法从DOM点击更新`$ scope`索引值

1 个答案: