AngularJS 不能更新数据属性？答案

【问题标题】：AngularJS cannot update data attributes?AngularJS 不能更新数据属性？
【发布时间】：2013-01-26 23:42:22
【问题描述】：

我有一个 input 元素，它使用 bootstrap 中的 type-ahead 插件。 我想将数据源属性设置为用户输入。效果类似于实例搜索。

<input id="test" data-provide="typeahead" data-source="{{titles}}"/>

在我的 AngularJS 控制器中，我有

$scope.titles = my_array_object

以上代码执行后，我在Chrome开发者工具中看到data-source属性设置正确。

但在 Chrome 控制台中，当我执行时

$('#test').data('source')

返回值为“”，空字符串

设置元素属性的正确方法是什么？

【问题讨论】：

您能解释一下您要做什么吗？例如，您为什么要尝试动态设置数据属性？

标签： html angularjs

【解决方案1】：

我想你想要这样的东西：http://plnkr.co/edit/ASeDxB5445HeiLKOq409?p=preview

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

  myApp.directive('moDataSource',function() {
        return {
          restrict:"A", 
          scope:{
            moDataSource:"=",
          },              
          link: function(scope, elem, attrs) {
            var typeahead = elem.typeahead().data("typeahead");             
            typeahead.source = scope.moDataSource;     
          }         
        };
        });

   function MainCtrl($scope) {       
       $scope.addItem = function (item) {
         if(item.length > 0)
            $scope.array.push(item);
       };
       $scope.array = ['Safari',"Internet Explorer","FireFox","Chrome"];     
   }

【讨论】：

有同样的问题，看起来 Firefox 中的 Angular 没有在数据属性中插入值，你需要使用不同的。