Как использовать переданные данные в шаблоне директивы?

0

Я создал повторно используемый компонент с директивой следующим образом:

app.directive("menu", function () {
    return {
        restrict: 'AE',
        templateUrl: '/menu.html',
        scope: {
            title: '=title'
        }
    };
});

menu.html:

<div>{{title}}</div>

Очевидно, я хочу передать свойство title извне, и показ находится внутри menu.html.

Использование в main.html:

<div menu title="test"></div>

Результат: маска не разрешена. Зачем?

  • 1
    попробуйте просто использовать - title: '='
  • 0
    что содержит $ scope.text?
Теги:

2 ответа

3
Лучший ответ

Вы должны заявить об этом так:

app.directive("menu", function () {
    return {
        restrict: 'AE',
        templateUrl: '/menu.html',
        scope: {
            title: '@'
        }
    };
});


Text Binding    (Prefix: @)
One-way Binding (Prefix: &) (for functions)
Two-way Binding (Prefix: =)

Это сообщение SO более глубокое о @vs =

Поделиться
  • 1
    В чем разница при использовании title: '@' (который работает) вместо title: '=' (который не работает)?
  • 0
    @membersound добавил некоторую информацию в мой ответ, я добавлю ссылку на угловой документ, как только найду его; p
Показать ещё 2 комментария
0

Существует три типа привязки к директивам:

  1. "@" (Привязка текста/односторонняя привязка)
  2. "=" (Привязка прямой модели/двусторонняя привязка)
  3. "&" (Привязка к действию/привязка метода)

Поэтому в вашем случае, если вы только заботитесь о отображении текста, вы должны использовать нотацию "@"

Поделиться

Ещё вопросы

Сообщество Overcoder
Наверх
Меню