Angular $ watch不响应指令点击事件

Question

如果我通过像这样的指令中的链接器函数编译我的元素

    .directive('contents', function ($compile, $templateRequest,         ContentModel) {
 var linker = function (scope, element, attrs) {
      element.html(scope.content.text);
      element.click(function (event) {
           scope.selected = scope.content;
           event.stopPropagation();
      });
      $compile(element.contents())(scope);
 )}


    return
    scope: { selected: "=" },
    link: linker,
    controller: 'ContentsCtrl',
    controllerAs: 'contentsCtrl',

该指令从主控制器接收内容。 似乎我无法获得我的scope.selected

的任何双向绑定

当我点击一个对象时，我想在我的主控制器中设置$ scope.selected对象。

在主控制器中我用它进行测试

    $scope.$watch('selected', function(){
        console.log($scope.selected);
    });

正如你可能看到我只是一个初学者......

Answer 1

您的指令存在一些编码问题：

.directive('contents', function ($compile, $templateRequest,         ContentModel) {
 var linker = function (scope, element, attrs) {
      //Not This
      //element.html(scope.content.text);
      //Do this
      element.html(scope.contentsCtrl.content.text);

      //Not this
      //element.click(function (event) {
      //Do this
      element.on('click', function (event) {
          scope.selected = scope.contentsCtrl.content;
          //
          //Use $apply here
          //
          scope.$apply();
          //
          event.stopPropagation();
      });
      $compile(element.contents())(scope);
 )}
return
scope: { selected: "=" },
link: linker,
controller: 'ContentsCtrl',
controllerAs: 'contentsCtrl',

问题＃1

指令控制器使用controllerAs: contentsCtrl进行实例化。使用scope.contentsCtrl访问控制器模型。

问题＃2

AngularJS jqLite未实现.click快捷方式。相反，请使用element.on('click'。

问题＃3

点击事件后，AngularJS需要进行摘要循环。请使用$apply。