在AngularJS指令中正確實現綁定對象屬性

Question

我已經創建了一個AngularJS指令來封裝Google地圖自動完成的Geocomplete插件。我試圖將它綁定到作用域的屬性，這是通過向現有元素添加「geocomplete」屬性來指定的。

geocompleteModule.directive("geocomplete", function ($log, $timeout, $compile, $controller) { 
     return { 
      restrict: 'A', 
      priority: 200, 
      link: function (scope, element, attrs, ctrl) { 
       var autocomplete = $(element).geocomplete().bind("geocode:result", function (event, result) { 
        if(result.geometry && result.geometry.location) { 
         var location = result.geometry.location; 
         scope.$apply(function (s) { 
          s[attrs.geocomplete] = new Models.Point(location.lat(), location.lng()); 
         }); 
        } 
       }); 
      } 
     }; 
    }); 

但是，如果geocomplete屬性中引用的屬性是子屬性，則這不起作用。例如：

<input geocomplete="location" /> 

工程。

<input geocomplete="search.location" /> 

不起作用。

從本質上講，AngularJS似乎可以用它自己的綁定來做到這一點，但是我怎麼去實現這個呢？

編輯

我知道這是如何使用拆分和循環來完成，但據推測，這是不是「正確」的方式。

Answer 1

只有兩個變化，我可以看到你的指令。增加了適用範圍，對geocomplete屬性「位置」有約束力的任何值，那麼在你的範圍內使用S [scope.location] $申請

指令文件：http://docs.angularjs.org/guide/directive

geocompleteModule.directive("geocomplete", function ($log, $timeout, $compile, $controller) { 
return { 
    restrict: 'A', 
    scope:{ 
     location:'=geocomplete' 
    }, 
    priority: 200, 
    link: function (scope, element, attrs) { 
     var autocomplete = $(element).geocomplete().bind("geocode:result", function (event, result) { 
      if(result.geometry && result.geometry.location) { 
       var location = result.geometry.location; 
       $timeout(function() { 
        scope.location = new Models.Point(location.lat(), location.lng()); 
       }); 
      } 
     }); 
    } 
}; 
}); 

Answer 2

s[attrs.geocomplete] = new Models.Point(location.lat(), location.lng()); 

替換，如：

var a = function(){}; 
var s = []; 

s.push({ 'attr' : 'aaa.bbb', 'method' : new a() });