Latest web development tutorials

AngularJS Controller

AngularJS AngularJS aplikasi data pengontrol.

kontroler AngularJS normal objek JavaScript.

AngularJS Controller

Aplikasi AngularJS adalah pengendali.

ng-controller direktif mendefinisikan controller aplikasi.

controller adalah objek JavaScript diciptakan oleh constructor dari objek JavaScript standar.

AngularJS contoh

<Div ng-app = "myApp " ng-controller = "myCtrl">

Nama: <input type = "text" ng-model = "firstName"> Situs
Nama asli: <input type = "text" ng-model = "lastName"> Situs
Situs
Nama: {{firstName + "" + lastName}}

</ Div>

<Script>
var aplikasi = angular.module ( 'myApp', []);
app.controller ( 'myCtrl', function ($ lingkup) {
$ Scope.firstName = "John";
$ Scope.lastName = "Doe";
});
</ Script>

Coba »

Aplikasi Analisis:

AngularJS aplikasi didefinisikan oleh ng-aplikasi. Aplikasi yang berjalan di <div> dalam.

ng-controller = "myCtrl"? properti adalah instruksi AngularJS. Hal ini digunakan untuk mendefinisikan controller.

Fungsi myCtrl adalah fungsi JavaScript.

AngularJS menggunakan $ lingkup objek untuk memanggil controller.

Dalam AngularJS, $ lingkup adalah sebuah aplikasi seperti (variabel dan fungsi milik aplikasi).

Kontroler $ lingkup (setara dengan ruang lingkup, rentang kendali) untuk menyimpan AngularJS Model (Model) obyek.

lingkup kontroler menciptakan dua sifat (firstName dan lastName).

ng-Model field input direktif mengikat controller atribut (firstName dan lastName).

metode controller

Contoh di atas menggambarkan objek controller dan properti firstName lastName dengan dua.

Controller juga mungkin memiliki metode (fungsi dan variabel):

AngularJS contoh

<Div ng-app = "myApp " ng-controller = "personCtrl">

Nama: <input type = "text" ng-model = "firstName"> Situs
Nama asli: <input type = "text" ng-model = "lastName"> Situs
Situs
Nama: {{fullName ()}}

</ Div>

<Script>
var aplikasi = angular.module ( 'myApp', []);
app.controller ( 'personCtrl', function ($ lingkup) {
$ Scope.firstName = "John";
$ Scope.lastName = "Doe";
$ Scope.fullName = function () {
return $ scope.firstName + "" + $ scope.lastName;
}
});
</ Script>

Coba »

kontroler file eksternal

Dalam aplikasi besar, controller biasanya disimpan dalam sebuah file eksternal.

Sederhananya <script> tag Copy kode bernama personController.js file eksternal dapat:

AngularJS contoh

<Div ng-app = "myApp " ng-controller = "personCtrl">

Nama Pertama: <input type = " text" ng-model = "firstName"> Situs
Nama terakhir: <input type = " text" ng-model = "lastName"> Situs
Situs
Nama Lengkap: {{firstName + " " + lastName}}

</ Div>

<Script src = "personController.js"> </ script>

Coba »

contoh lain

Contoh berikut membuat file kontroler baru:

angular.module ( 'myApp', []). controller ( 'namesCtrl', function ($ lingkup) {
$ Scope.names = [
{Nama: 'Jani', negara: 'Norwegia'},
{Nama: 'Hege', negara: 'Swedia'},
{Nama: 'Kai', negara: 'Denmark'}
];
});

Menyimpan file sebagai namesController.js :

Kemudian, dengan menggunakan controller dalam file aplikasi:

AngularJS contoh

<Div ng-app = "myApp " ng-controller = "namesCtrl">

<Ul>
<Li ng-repeat = "x dalam nama">
{{X.name + ',' + x.country}}
</ Li>
</ Ul>

</ Div>

<Script src = "namesController.js"> </ script>

Coba »