Question

我正在寻找这个问题的答案：

Multi State button like toggle in angularJS

...但是使用指令。主要原因是我试图实现隔离范围以创建可重用按钮。我试过了：

angular.module('myApp', [])
    .directive('buttonToggle', function() {
        return {
            restrict: 'A',
            scope: {
                myBtnArr: "="
            },
            myBtnTxt: ["AND", "OR", "NOT"],
            template: '<button>{{ myBtnTxt[myBtnArr] }} </button>'
        }
    });

在HTML中使用类似的内容：

<div button-toggle my-btn-arr=0></div>

但是Angular似乎并不喜欢这种风格，要么显示按钮而不显示文字，要么抛出神秘的 a.match不是函数 错误。想法？

Answer 1

您需要修改指令以包含链接功能。然后将myBtnTxt放在那里的范围内。像这样：

app.directive('buttonToggle', function() {
  return {
    restrict: 'A',
    scope: {
      myBtnArr: "="
      },
    template: '<button>{{myBtnTxt[myBtnArr]}}</button>',
    link: function(scope){
      scope.myBtnTxt = ["AND", "OR", "NOT"];
    }
  };
});

角度三向按钮与指令

1 个答案: