Expressões em AngularJS
No angularJS, o conceito de Expressões ou expressões é semelhante ao do javascript puro, podemos colocar expressões dentro da estrutura HTML através de 2 chaves duplas (chaves duplas) com a seguinte estrutura: {{expressions}} .
Esta expressão é frequentemente usada para poder colocar dados definidos da camada do controlador no html, além disso, podemos colocar uma expressão matemática, expressão relacional, constante ou resultado. Retorna a saída do método no controlador na estrutura html para exibir o resultado.
Vamos ao exemplo:
<!DOCTYPE html> <html lang="en" ng-app="exampleviewApp"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Example View AngularJS</title> <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.2.15/angular.min.js"></script> </head> <body ng-controller="mainController"> <h2>Hello {{name}}</h2> <input type="text" ng-model="name" /> <p> <strong>Example expression</strong> <br/> Bieu thuc so hoc {{2+2}} <br/> Bieu thuc quan he {{1==2}} <br/> Hang so {{5}} <br/> Du lieu trong controller {{name}} <br/> Du lieu trong controller {{arr[0]}} <br/> Su dung ng-bind directive de dua du lieu ra html <strong ng-bind="name"></strong> <br/> Su dung ng-bind directive de dua du lieu ra html <strong ng-bind="5+6"></strong> <br/> Su dung ng-bind directive de dua du lieu ra html <strong ng-bind="1==2"></strong> </p> </body> <script> var exampleviewApp = angular.module('exampleviewApp', []); exampleviewApp.controller('mainController', function($scope) { $scope.name = 'test'; $scope.arr = [2,3,4]; }); </script> </html>Resultados impressos no navegador:
Também podemos injetar a expressão dentro da diretiva ng-bind (veja a linha número 26,28,30): <strong ng-bind="name"></strong> …
Nota: as expressões angulares também têm certas limitações, embora sejam bastante semelhantes às expressões javascript regulares, por exemplo, elas não podem ser usadas para expressões regulares, loops ou instruções de condição
Bài viết liên quan:
Dịch vụ thiết kế Wesbite
