Question

我正在尝试在ng-repeat中动态构建编码查询，然后将其传递给typeahead指令。

我知道我可以传入类似于这个jsfiddle的整个ng-repeat项目： http://jsfiddle.net/yaroslavya/8YEkh/

我知道您可以轻松地将字符串传递给指令属性。

有两种方法可以做到吗？

基本上在上面的小提琴中，我想做类似的事情：

    <div ng-repeat="image in images">            
        <typeahead-directive image='"encoded_query=" + image' ></div>
    </div>

我尝试这样做并且它在控制台中工作，但ng-repeat属性实际上并不存储在指令中：

    <div ng-repeat="image in images">            
        <typeahead-directive image='encoded_query={{image}}' ></div>
    </div>

有什么建议吗？

Answer 1

有两种方法可以做到吗？

在您的指令中，您可以使用image获取$attrs属性的字符串值。

您可以使用$eval从image属性中获取对象。

您的HTML

<div ng-repeat="image in images">            
      <div myimg image='image' ></div>
</div>

指令

myModule.directive('myimg', function(){
    return{
        restrict: 'A',
        scope: false,
        template: '<p>{{image.title}}</p><img src="{{image.url}}" />',
        controller: ['$scope','$attrs', function($scope, $attrs) {
            console.log($attrs.image);
            console.log($scope.$eval($attrs.image));
        }]
        /*link:function(scope, elem, attr){
            console.log(attr.image);
            console.log(scope.$eval(attr.image));
        }*/
    };
});

控制器本地属性记录在AngularJS $compile API Reference -- controllers

中

AngularJS scope API Reference

中记录了$eval功能

另请注意，我设置scope: false因为您的指令实际上不需要范围。

Ng-重复成一个带有字符串＆amp;的指令ng-repeat属性

1 个答案: