Question

问题：

在嵌套在3个ui-views中的指令中，我无法访问隔离范围的值。 scope.values返回{}但是当我在console.log scope时，我可以看到values属性上的所有值。

在另一个应用程序中，我可以使这个工作，我也将此转换为该方法，但它仍然无法工作，我正在追踪路线，ctrl's，我找不到两者之间的差异。

我正试图从

访问它

Init App＆gt; ui-view＆gt; ui-view＆gt; ui-view＆gt;表单元素＆gt;形手风琴上

我正在使用的是什么：

视图

<ul class='form-elements'>
    <li
        class='row-fluid'
        ng-hide='group.hidden'
        ng-repeat='group in main.card.groups'
        card='main.card'
        form-element
        values='values'
        group='group'>
    </li>
</ul>

该指令包含大量不同的表单类型，并调用它们各自的指令。

.directive('formElement', [function () {
    return {
        scope: {
            values: '=',
            group: '='
        },
        link: function(scope, element) {
            l(scope.$parent.values);
            element.attr('data-type', scope.group.type);
        },
        restrict: 'AE',
        template: "<label ng-hide='group.type == \"section-break\"'>" +
            "{{ group.name }}" +
            "<strong ng-if='group.required' style='font-size: 20px;' class='text-error'>*</strong> " +
            "<i ng-if='group.hidden' class='icon-eye-close'></i>" +
        "</label>" +
        "<div ng-switch='group.type'>" +
            "<div ng-switch-when='accordion-start' form-accordion-on card='card' values='values' group='group'></div>" +
            "<div ng-switch-when='accordion-end' form-accordion-off values='values' class='text-center' group='group'><hr class='mbs mtn'></div>" +
            "<div ng-switch-when='address' form-address values='values' group='group'>" +
        "</div>"
    };
}])

这是指令示例指令。

.directive('formAccordionOn', ['$timeout', function($timeout) {
    return {
        scope: {
            group: '=',
            values: '='
        },
        template: "<div class='btn-group'>" +
            "<button type='button' class='btn' ng-class='{ active: values[group.trackers[0].id] == option }' ng-model='values[group.trackers[0].id]' ng-click='values[group.trackers[0].id] = option; toggleInBetweenElements()' ng-repeat='option in group.trackers[0].dropdown track by $index'>{{ option }}</button>" +
        "</div>",
        link: function(scope, element) {
            console.log(scope) // returns the scope with the values property and it's values.
            console.log(scope.values); // returns {}
        })

        // etc code ...

与我密切相关，但我在每个隔离范围对象上使用=： AngularJS: Can't get a value of variable from ctrl scope into directive

更新

很抱歉，如果这有点模糊，我已经花了好几个小时试图寻找更好的解决方案。这正是我的主题。

更新2

我无法相信这是simple。

var init = false;
scope.$watch('values', function(newVal, oldVal) {
    if (_.size(newVal) !== _.size(oldVal)) {
        // scope.values has the value I sent with it!
        init = true;
        getInitValues();
    }
});

但是这感觉很难，有没有更优雅的方法来处理这个？

更新3

当值准备就绪时，我在我的ctrl中附加了一个标志，当发生这种情况时bam！

scope.$watch('values', function(newVal) {
    if (newVal.init) {
        getInitValues();
    }
});

Answer 1

console.log()的输出是实时视图（可能取决于浏览器）。

当您检查console.log(scope); scope的输出时，同时已更新。您看到的是当前值。那就是执行link函数时scope.values确实是一个空对象。这反过来意味着values在执行link之后会更新，显然。

如果您的实际问题在values的执行期间未访问link，则需要提供更多详细信息。

更新

根据您的评论和编辑，您似乎需要进行一次初始化，只要值存在。我建议如下：

var init = scope.$watch('values', function(newVal, oldVal) {
  if (newVal ==== oldVal) { //Use this if values is replaced, otherwise use a comparison of your choice
    getInitValues();
    init();
  }
});

init()删除观察者。

AngularJS：无法在指令中获取isolate scope属性的访问值

问题：

我正在使用的是什么：

1 个答案:

更新