Использование логического значения в пользовательской директиве angularjs

Question

Я пытаюсь использовать директивы, однако мне грозит проблема с прохождением через логическое значение. Когда я оцениваю мою страницу, это то, что я получаю как ошибка:

Syntax Error: Token '{' invalid key at column 2 of the expression [{{app.isNew}}] starting at [{app.isNew}}].

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

home.html

<featured-app app-title="{{app.title}}" app-is-new={{app.isNew}}></featured-app> 

домой. js

app.controller('HomeCtrl', [ '$scope', function($scope) { 
    $scope.app.title = "App name"; 
    $scope.app.isNew = true; 
}]); 

featuredApp.js

app.directive('featuredApp', function() { 
    return { 
     templateUrl: 'directives/templates/featuredApp.html', 
     scope: { 
      appTitle: '@', 
      appIsNew: '=' 
     } 
    }; 
}); 

featuredApp.html

<h2>{{appTitle}} <span class="label label-default" ng-show="{{appIsNew}}">New</span></h2> 

Кто-нибудь есть какие-либо идеи, почему я получаю ошибку выше? Я не знаю, где я ошибся.

Answer 1

Изменить HTML для:

home.html

<featured-app app-title="{{app.title}}" app-is-new="app.isNew"></featured-app> 

или изменить featuredApp.js на:

app.directive('featuredApp', function() { 
    return { 
     templateUrl: 'directives/templates/featuredApp.html', 
     scope: { 
      appTitle: '@', 
      appIsNew: '@' 
     } 
    }; 
}); 

выше, зависит от ваших требований. Один - односторонний, связанный другой - двусторонний. Хотя вы должны также сделать следующие изменения:

featuredApp.html

<h2>{{appTitle}} <span class="label label-default" ng-show="appIsNew">New</span></h2> 

Answer 2

Replace:

<featured-app app-title="{{app.title}}" app-is-new={{app.isNew}}></featured-app> 

С:

<featured-app app-title="app.title" app-is-new=app.isNew></featured-app> 

И:

appTitle: '@', 

С:

appTitle: '=', 

Проблема заключалась в том, что вы использовали {{}} в тех местах, где Угловая ожидает имя переменной.