Update angularjs.md

Lint HTML & JS Code
This commit is contained in:
Hugo Torzuoli 2018-02-13 00:06:00 +01:00 committed by GitHub
parent e780580524
commit c621068b96
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 36 additions and 27 deletions

View File

@ -2,35 +2,40 @@
title: Angular.js title: Angular.js
category: JavaScript libraries category: JavaScript libraries
--- ---
```html
<html ng-app="nameApp">    <html ng-app="nameApp">
```
### Lists (ng-repeat) ### Lists (ng-repeat)
```html
<ul ng-controller="MyListCtrl"> <ul ng-controller="MyListCtrl">
<li ng-repeat="phone in phones"> <li ng-repeat="phone in phones">
{{phone.name}} {{phone.name}}
</li> </li>
</ul>    </ul>
```
### Model (ng-model) ### Model (ng-model)
```html
<select ng-model="orderProp"> <select ng-model="orderProp">
<option value="name">Alphabetical</option> <option value="name">Alphabetical</option>
<option value="age">Newest</option> <option value="age">Newest</option>
</select>    </select>
```
### Defining a module ### Defining a module
```js
App = angular.module('myApp', []);    App = angular.module('myApp', []);
App.controller('MyListCtrl', function ($scope) { App.controller('MyListCtrl', function ($scope) {
$scope.phones = [ ... ]; $scope.phones = [ ... ];
});    });
```
### Controller with protection from minification ### Controller with protection from minification
```js
App.controller('Name', [    App.controller('Name', [
'$scope', '$scope',
'$http', '$http',
function ($scope, $http) { function ($scope, $http) {
@ -41,44 +46,48 @@ category: JavaScript libraries
'$scope' '$scope'
'$http' '$http'
($scope, $http) -> ($scope, $http) ->
]    ]
```
### Service ### Service
```js
App.service('NameService', function($http){    App.service('NameService', function($http){
return { return {
get: function(){ get: function(){
return $http.get(url); return $http.get(url);
} }
} }
});    });
```
In controller you call with parameter and will use promises to return data from server. In controller you call with parameter and will use promises to return data from server.
App.controller('controllerName', ```js
   App.controller('controllerName',
function(NameService){ function(NameService){
NameService.get() NameService.get()
.then(function(){}) .then(function(){})
})    })
```
### Directive ### Directive
```js
App.directive('name', function(){    App.directive('name', function(){
return { return {
template: '<h1>Hello</h1>' template: '<h1>Hello</h1>'
} }
});    });
```
In HTML will use `<name></name>` to render your template `<h1>Hello</h1>` In HTML will use `<name></name>` to render your template `<h1>Hello</h1>`
### HTTP ### HTTP
```js
App.controller('PhoneListCtrl', function ($scope, $http) { App.controller('PhoneListCtrl', function ($scope, $http) {
$http.get('/data.json').success(function (data) { $http.get('/data.json').success(function (data) {
$scope.phones = data; $scope.phones = data;
}) })
});    });
```
References: References:
* https://github.com/angular/angular-seed * https://github.com/angular/angular-seed