Question

我不确定这是否确实可行，但基本上我试图将我的指令上的隔离范围设置为将从控制器中的数组中提取的变量。

指令：

app.directive('ydConfig', function($log) {
    return {
        restrict: 'E',
        scope: {
            tag: '='
        },
        templateUrl: function(element, attrs) {
              return attrs['template'];
        }
    };
});

控制器中的数组：

$scope.configHead = ['style', 'color', 'glass', 'details'];
$scope.activeTabs = ['style'];
$scope.configType = $scope.activeTabs[0];

HTML：

<yd-config tag="style" template="/app/views/yd-config-item.html" ng-if="isTabOpen('style')" ng-class="{right : direction, left : !direction}" ng-animate class="{{configType}}"></yd-config>

基本上，configHead是一个数组，其中包含yd-config最终将使用的所有范围，因为用户使用切换循环通过yd-config。 activeTabs通常包含一个对象，但有时包含两个，而yd-config正在更改范围和数据。 configType存在，以便我可以定位当前活动的作用域并在DOM中访问它。

在我的HTML中，有没有一种方法可以改变＆＃34; style＆＃34;在标签隔离范围内是configType？我已尝试使用和不带前缀$ scope的{{configType}}，我尝试过没有双花括号，但我总是得到this error。

我如何将configType放入ng-if以便我的yd-config完全通用？在那一刻，我在DOM中一个接一个地进行了4次配置，每个都有不同的标签和ng-if（并且，直到我创建这张票之前，还有不同的类）。

我最好的选择是创建一个返回configType的函数，只是从指令的那些部分定位函数？

我在上一个关于SO的问题中看过this fiddle，所以我知道这是可能的，但为什么我在尝试时会收到错误？

Answer 1

您尝试过的应该是有效的。您可以使用$scope.configType将tag="configType"传递给指令，并在ng-if中使用它ng-if="isTabOpen(configType)"

＆＃13;

var app = angular.module('app', []);

app.controller('ctrl', function ($scope) {
  $scope.configHead = ['style', 'color', 'glass', 'details'];
  $scope.activeTabs = ['style'];
  $scope.configType = $scope.activeTabs[0];
  
  $scope.isTabOpen = function (tab) {
    return $scope.activeTabs.indexOf(tab) != -1
  }
});

app.directive('ydConfig', function($log) {
    return {
        restrict: 'E',
        scope: {
            tag: '='
        },
        /*templateUrl: function(element, attrs) {
              return attrs['template'];
        }*/
        template: '<span>{{ tag }}</span>'
    };
});

＆＃13;

<html ng-app="app">
  <head>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
   </head>
  
  <body ng-controller="ctrl">
    <yd-config tag="configType" ng-if="isTabOpen(configType)"></yd-config>
  </body>
</html>

＆＃13;

将隔离范围设置为变量

1 个答案: