Angular 1.0.1 与 1.3.0 的指令

【问题标题】：Angular 1.0.1 vs 1.3.0 for directivesAngular 1.0.1 与 1.3.0 的指令
【发布时间】：2014-09-12 17:22:26
【问题描述】：

我构建了一个具有独立作用域的简单指令。但它在 1.0.1 版中运行良好，但在 1.3.0 版中运行良好。问题是什么？

Angular 1.0.1 版本示例：http://jsfiddle.net/k2rnavrg/

Angular 1.3.0 版本示例：http://jsfiddle.net/k2rnavrg/2/

var myModule = angular.module('myModule', [])
    .directive('qImg', function () {
    return {
        restrict: 'E',
        scope: {

            m: '=mF'

        }


    };
})
    .controller('MyCtrl', ['$scope', function ($scope) {
    $scope.foo = 'Hello Samitha!';

}]);

【问题讨论】：

不是它改变了你的问题，而是你链接到 1.2.0 版本而不是 1.3.0
1.2.0版本同样的问题
什么不起作用？您的问题描述不应要求人们测试 2 个不同的版本来了解它们的工作原理并弄清楚预期的行为
看看这里的第一个答案stackoverflow.com/questions/19943935/…

标签： javascript angularjs angularjs-directive

【解决方案1】：

您不能将指令与元素混淆。

<q-img m-f="foo">

这是一个q-img 元素，还附加了一个qImg 指令。该指令创建的隔离作用域只能由该指令访问，其他人不能访问，例如ngModel 指令。

<div ng-controller="MyCtrl">{{foo}}
  <q-img m-f="foo">
      <input type='text' ng-model="m">
  </q-img>

ng-Controller 创建一个供此处看到的所有指令使用的作用域，除了使用隔离作用域的qImgdirective。

如果您希望 ngModel 指令访问隔离范围，则需要将 input 放入模板中，而不是直接放入 DOM：

var myModule = angular.module('myModule', [])
  .directive('qImg', function () {
  return {
    restrict: 'E',
    template: '<input type="text" ng-model="m">',
    scope: {
        m: '=mF'
    }
  };
})

<div ng-controller="MyCtrl">{{foo}}
  <q-img m-f="foo"></q-img>
</div>

似乎行为在 1.2 中发生了变化。

【讨论】：