从角材料扩展芯片答案

【问题标题】：Extending Chips from angular-material从角材料扩展芯片
【发布时间】：2016-01-28 12:45:12
【问题描述】：

我正在尝试在 md-chips 之上创建一个名为 chip-filter 的层

其中内置了一些额外的功能；例如

导航芯片（移除后会将用户重定向回特定网址）
从应用程序的任何位置添加芯片
...

所以我得到了基本的工作，在 componentsRegistry 中挂钩，并且能够从任何地方调用它。

但现在我正试图将芯片从 chipFilterController 放入<md-chips>

html:

<chip-filter md-component-id="testId">
  <md-chips ng-model="chips">
    <md-chip-template>
      <strong>{{$chip}}</strong>
      <em>(type)</em>
    </md-chip-template>
  </md-chips>
</chip-filter>

和指令：

function chipFilterDirective($log) {
  function postLink(scope, element, attr, sidenavCtrl) {
    element.on("$destroy", function() {
      sidenavCtrl.destroy();
    });
  }

  return {
    restrict: "E",
    scope: {},
    controller: "chipFilterController",
    compile: function(element) {
      return postLink;
    }
  };
}

和控制器：

function chipFilterController($scope, $element, $attrs, $mdComponentRegistry, $q, $log) {
  var self = this;
  $scope.chips = [];
      function addChip(input, type) {
    var def = $q.defer();

    $scope.chips.push({
      name: input,
      type: type
    });

    def.resolve();
    return def.promise;
  }

  self.addNavigationChip = function() {
    return addChip("stuff");
  };
  self.addChip = function() {
    return addChip("stuff");
  };

  self.destroy = $mdComponentRegistry.register(self, $attrs.mdComponentId);
}

完整的代码笔： http://codepen.io/cskiwi/pen/eJryqK?editors=1010

【问题讨论】：

标签： angularjs angular-material

【解决方案1】：

将scope 设置为 false（或将其从对象中删除）使其工作

【讨论】：