ng-include при загрузке объекта

Это работает

<div ng-include="template.html" onload="person='Jane'"></div>

^ Это устанавливает локальную переменную области видимости person во включении на «Джейн» (строка).

Но я хочу передать объект человека, который называется user: {name: 'Jane' }

<div ng-include="template.html" onload="person=user"></div>

^ Это устанавливает локальную переменную области видимости person во включении как «неопределенную».

Как можно передать объект как локальную переменную в ng-include?


angularjs angularjs-ng-include
person dylanjha    schedule 28.06.2014    source источник
comment
возможный дубликат stackoverflow.com/questions/13422966/   -  person Jonathan Wilson    schedule 28.06.2014
comment
Я не думаю, что это дубликат. Поправьте меня, если я ошибаюсь, ng-init не решает это для меня, дайте мне посмотреть, смогу ли я получить jsfiddle, который будет демонстрировать   -  person dylanjha    schedule 28.06.2014
comment
Решение заключается в создании новой директивы, как я сказал в этом ответе: stackoverflow.com/a/36916276/2516399   -  person smartmouse    schedule 28.04.2016

Ответы (2)


arrow_upward
1
arrow_downward

Возможно, вам действительно нужна пользовательская директива:

<div person-directive="{name:'Jane'}"></div>

JS:

angular.module('myApp',[])
.directive('personDirective',function(){
    return {
        restrict: 'A',
        scope: {
            person: '=personDirective'
        },
        templateUrl: 'template.html'
    };
});

При этом вы привязываете переданное значение к person в загруженном шаблоне.

Рабочая скрипка

person Jonathan Wilson    schedule 28.06.2014
comment
да, директива работает, просто показалось немного излишним, думал, что мне сойдет с рук ng-include. - person dylanjha; 28.06.2014
comment
Перебор? Не совсем. - person Jonathan Wilson; 28.06.2014

arrow_upward
1
arrow_downward

ng-include нельзя использовать повторно, потому что он не предлагает способ установки локальных переменных. Использование onload плохо, потому что оно засоряет глобальную область видимости. Если пример станет немного сложнее, он потерпит неудачу.

Создание новой директивы вместо использования ng- include — более чистое решение.

Идеальное использование выглядит так:

<div ng-include-template="template.html" ng-include-variables="{ person: 'Jane' }"></div>
<div ng-include-template="template.html" ng-include-variables="{ person: user }"></div>

Директива:

.directive(
  'ngIncludeTemplate'
  () ->
    {
      templateUrl: (elem, attrs) -> attrs.ngIncludeTemplate
      restrict: 'A'
      scope: {
        'ngIncludeVariables': '&'
      }
      link: (scope, elem, attrs) ->
        vars = scope.ngIncludeVariables()
        for key, value of vars
          scope[key] = value
    }
)

Вы можете видеть, что директива не использует глобальную область видимости. Вместо этого директива считывает объект из ng-include-variables и добавляет эти члены в свою локальную область.

Это чисто и универсально.

person Tanin    schedule 25.10.2015
comment
Что означает ->? - person smartmouse; 28.04.2016
comment
Это кофейный скрипт. () -> { ... } это function() { ... } - person Tanin; 28.04.2016