Question

我正在使用一个指令，它只是freebase搜索小部件（jquery）的包装器。这是我尝试过的第一个指令，我遇到了一些问题。

所需功能： 1.能够传递语言（双字母代码）以显示搜索结果作为属性 2.选择项目时指定要调用的函数的能力（从选择中传递数据）

我已设置a plunkr with the directive here。第二部分功能正常，但我遇到了语言要求的问题，我不确定原因。

传递语言代码时，静态（非插值）可以正常工作：

if(attrs.lang){
     language = attrs.lang;
}

但是当我尝试传递这样的值时，我似乎无法让它工作：

attrs.$observe('lang', function(value) {
      if(value === ""){
           language = 'en';
      } else {
          console.log("lang val " + value);
          language = value;
      }
});

知道为什么这不起作用？任何建议将不胜感激。

目前的指令：

directive('suggest', function($http) {
    var language; 
    return {
        restrict: 'E',
        template: "<input type='text'>",
        replace:true,
        scope:{
            selectData:'=',
            onSelect:'&'
        },
        link: function(scope, element, attrs) {

            attrs.$observe('lang', function(value) {
                if(value === ""){
                    language = 'en';
                } else {
                    console.log("lang val " + value);
                    language = value;
                }
            });

            if(attrs.lang){
                language = attrs.lang;
            }


            $(element).suggest({

                "lang": language
            })
            .bind("fb-select", function(e, info) { 
                console.log(info);
                scope.onSelect({data:info});
                console.log("language: " + language);
                scope.$apply(function(){
                    console.log("hello apply here");
                    scope.selectData = info;
                });
            });
        }
    };
});

Answer 1

从您的问题中不清楚，但我认为您的意思是以下问题：在plunker演示中我输入'fr'到该语言，然后输入一些建议框，它会获得'en'语言的结果。< / p>

这是因为您已使用默认语言（en）初始化了建议插件。提供给$observe函数的函数不会在此处调用 - 稍后将在初始化指令后调用它。因此，当语言发生变化时，您需要重新初始化建议插件。

我不确定这样做的正确方法是什么，因为我不熟悉该插件，但至少以下更改正在运行 - 只需向$observe侦听器添加重新初始化：< / p>

    attrs.$observe('lang', function(value) {
      console.log("lang val " + value);
        language = value;
        $(element).suggest({lang: language});
    });

传递Angularjs指令中的属性

1 个答案: