Как отображать угловой контент условно?

Question

Я хочу отобразить некоторый ui-контент в интерфейсе, основываясь на состоянии переменной контроллера boolean.

контроллер:

$scope.test = [ 
    myvar = true 
    //some other variables and data 
]; 

HTML:

<div ng-controller"mycontroller"> 
    <p>'{{test}}'</p> 
    <p>'{{test.myvar}}'</p> 
    <p ng-if="{{test.myvar}}">show this content</p> 
</div> 

Результат:

'[true]' 
'' 

2-е утверждение каким-то образом не оказаны. Зачем?

Answer 1

[] является литералом для массивов, в которых нет строковых ключей.
= назначает переменную, она не используется для связывания ключей и значений.

Вы хотите литерал объекта, который выглядит следующим образом:

$scope.test = { 
    myvar: true 
}; 

Вы также перепутались синтаксис директивы:

<p ng-if="test.myvar">show this content</p> 

{{}} не является необходимым в основном все директивы; содержимое атрибута директивы анализируется внутри директивы, его не нужно связывать. {{}} в значительной степени необходим только для «эхо» данных.

Answer 2

Квадратные квадраты это массив. Пример: ['Charles', 'Jay', 'Jonh'] Кудрявые скобки это объект. Пример: {name: 'Charles', phone: '91332323'}

В объекте вы можете получить доступ к переменной с помощью.. нотации.

Вы ищете объект, а не массив.

Answer 3

Нет необходимости ставить фигурные скобки для нг-если ..Just использование нг-если = «test.myvar» и использовать

$scope.test = { 
myvar: true }; 

Answer 4

В объектах JavaScript создаются с помощью фигурных скобок, как это :

$scope.test = { 
    myvar: true 
}; 

И, при использовании ng директивы, угловой разбирает переменную без {{ }}, поэтому вы должны просто сделать это:

ng-if="test.myvar"