angularjs: простой пример - нг-класс или нг-контроллер не работает

PLS, помогите мне с следующим вопросомangularjs: простой пример - нг-класс или нг-контроллер не работает

Я пытаюсь реализовать условные классы по Div блоков с использованием нг-класса, но столкнулся с очередной проблемой - «это не работает". Пример кажется очень простым, я даже не знаю, как еще это можно описать.

Но еще одна идея - контроллер не работает вместо ng-класса ..... я не знаю.

Здесь вы можете увидеть мои коментарии, вероятно, вы найдете что-то неправильно или дайте мне совет.

http://plnkr.co/edit/Zm0g4QfkqzTD3h4FWfcp?p=preview

demoApp = angular.module('demoApp',[]); 

var controllers = {}; 


controllers.testCntr = function ($scope) 
    { 
    $scope.setClass = function() 
    { 
     alert('works'); 
     return True; 
    } 
    };

HTML

<!doctype html> 
<html ng-app="demoApp"> 
<head> 
    <title></title> 

<style> 

.red 
    { 
    color:red; 
    } 

</style> 



    <script src="angular.min.js"></script> 
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.16/angular-route.js"></script> 
</head> 

<body> 

    <div ng-controller="testCntr"> 
     <span ng-class="{red: $scope.setClass()}">Test color</span> 

     <div>{{$scope.setClass()}}</div> 

    </div> 


</body> 


</html>

Спасибо за ваши поправки.

источник

2015-08-13 Andrii Hidden

Спасибо, я понял свои ошибки, но два все неясно -1) почему я должен использовать .controller() вместо контроллеров = {} ..... могут быть некоторые статьи для чтения 2) если ale rt будет оставаться в коде (или добавлен в функцию setClass()) - он будет повышаться в 5 раз :), почему 5 ??? Ожидается поведение –

ОК. Чтобы быть справедливым - последний вопрос (относительно «предупреждения»), я попрошу в другой должности. –

Чтобы добавить контроллер для вашего приложения, вы должны сделать это

demoApp.controller('testCntr', function ($scope) { 
    $scope.setClass = function() { 
     alert('works'); 
     return True; 
    } 
    })

Рабочая Plunkr: http://plnkr.co/edit/LPY94jPJdIJX4pr9K5FY?p=preview

Рабочая Демо:

demoApp = angular.module('demoApp',[]); 
 
demoApp.controller('testCntr', function ($scope) { 
 
    $scope.setClass = function() { 
 
     alert('works'); 
 
     return 33; 
 
     return True; 
 
    } 
 
    })

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 

 
<div ng-app="demoApp" <div="" ng-controller="testCntr"> 
 
     <span ng-class="{red: $scope.setClass()}">Test color</span> 
 
     <div>{{setClass()}}</div> 
 

 
</div>

источник

2015-08-13 14:33:47 Aminadav

При вызове функции, которая находится в объеме с точки зрения, просто назвать его так:

<body ng-app="app"> 
    <div ng-controller="Ctrl"> 
     <span ng-class="{'red': setClass()}">Test color</span> 
     <div>{{setClass()}}</div> 
    </div> 
    </body>

Здесь Working Plunkr

источник

2015-08-13 14:37:52

Вы должны создать app.js services.js и controllers.js

Ваш контроллер следует перенести в controllers.js и посмотреть немного что-то вроде этого.

demoApp.controller('testCntr',function ($scope){ 
    $scope.setClass = (function(){ 
    alert('works'); 
    return True; 
    }) 
});

источник

2015-08-13 14:38:48

Несколько проблем здесь.

Вы можете добавить только один контроллер одновременно с .controller()
В шаблоне, $scope уже контекст, так что не включить его в HTML
True должен быть true
Вы пропускаете ng-app директиву
angular.js не входит должным образом
Ваш scripts.js не входит

Вот рабочая версия вашего Plunkr с изменениями выше: http://plnkr.co/edit/ybDScjDrrIkH8tBNfIg1?p=preview

источник

2015-08-13 14:40:22 Mike

вашего сценария.JS файл должен быть

var app = angular.module('demoApp',[]); 

app.controller('testCntr', ['$scope', function($scope) { 

    $scope.setClass = function() { 
    return true; 
    }; 

} 
]);

и HTML:

<!DOCTYPE html> 
<html ng-app="demoApp"> 

    <head> 
    <script src="angular.min.js"></script> 
    <script src="script.js"></script> 
    <style> 
      .red { 
      color:red; 
      } 
    </style> 
    </head> 

    <body ng-controller="testCntr"> 
    <span ng-class="{red: setClass()}">Test color</span> 
    </body> 

</html>

Это может решить вашу проблему

Plunker ссылка: http://plnkr.co/edit/Ftx3M0aG9G8cJtyrn5wj?p=preview

источник

2015-08-13 15:06:26

angularjs: простой пример - нг-класс или нг-контроллер не работает

ответ

Смежные вопросы