Question

我正在尝试自定义此工作http://jsfiddle.net/markcoleman/JNqqU/，在当前工作小提琴中直接分配对象。我试图将其更改为$ scope.obj.items。将对象传递给指令不起作用。

我需要写一些$ watch变量???我正在获得动态值，这就是为什么我试图用这个传递Object值。

代码::

<a href="#" pop-over items="obj.items", title="Mode of transport">
   Show Pop over</a>

javascript指令部分::

 scope: {
            items: '=',
            title: '@'
        }

任何建议，

我正在尝试以下小提琴 http://jsfiddle.net/JNqqU/652/

Answer 1

您可以将控制器更改为：

bootstrap.controller('maincnt', function ($scope) {
    $scope.obj = { // declare the scope object here with a blank items 
        items: []
    };
    $scope.updateitem = function () {
        alert('scope update called');
        $scope.obj.items = ['car', 'truck', 'plane', 'bike']; // now update here
    }
});

Checkout fiddle.

Answer 2

是的，你应该做一个观察者。

$scope.$watchCollection('items', function (newValue, oldValue) {
  if (newValue) {
     buildTemplate(newValue);
  }
});

注意：我使用了watchCollection，因为它是一个数组。如果是对象或简单值，则会使用$ watch。

Answer 3

你不需要将它包装成对象，但不要重写＆＃39;整个阵列更新＆＃39;方法，但将值推入其中：

bootstrap.controller('maincnt',function($scope){
    $scope.items = [];
    $scope.updateitem=function(){
        alert('scope update called');
        $scope.items.push('car', 'truck', 'plane', 'bike');
    }

});

http://jsfiddle.net/btfu30k2/1/

$ watch也是不必要的。

Answer 4

您需要进行两项更改：

更改HTML items :: {{obj.items}}

控制器默认obj项目的更改应使用空数组$scope.obj={items:[]};）分配，因为popOver $compile正在寻找scope.items

请参阅此Working fiddle

您的观察结果也可以删除模板中的测试代码{{items | json }}。

将对象值传递给指令而不是任何其他数据变量

4 个答案: