masyarakat Belajar Perpustakaan Alatan Masa lapang
cari
Melayu
angular.js - Demo peringkat kemasukan yang sangat mudah bagi angularjs, tetapi ralat telah dilaporkan.
PHP中文网
PHP中文网 2017-05-15 16:56:52
0
2
508

Saya baru menggunakan angularjs dan saya sedang membaca buku yang dipanggil "tutorial berwibawa angularjs". Terdapat demo dalam bab kedua, seperti berikut.

Versi sudut 1.2.29 digunakan di sini Jika ia ditukar kepada 1.3.1, ralat akan dilaporkan.

Maaf, bagaimana ini berlaku? Bagaimanakah saya harus nyahpepijat ralat ini? 

<!doctype html> 
<html ng-app> 
<head> 
    <meta charset="utf-8"> 
    <title>Simple App</title> 
    <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.2.29/angular.min.js"></script>
</head>
<body>
    <p ng-controller="MyController">
        <h1>Hello {{clock}}</h1>
    </p>
    
    <script type="text/javascript">
        function MyController($scope, $timeout) {
            $scope.clock = new Date();
            var updateClock = function() {
              $scope.clock = new Date();
            };
            setInterval(function() {
              $scope.$apply(updateClock);
            }, 1000);
            updateClock();
      };
    </script>
</body>
</html>
PHP中文网
PHP中文网

认证0级讲师

membalas semua(2)
迷茫
迷茫2017-05-15 16:58:52 Tingkat 2

Selepas versi 1.3, pengawal tidak lagi ditemui pada objek tetingkap $controller will no longer look for controllers on window.

https://github.com/angular/angular.js/blob/master/CHANGELOG.md#breaking-changes-31

<!DOCTYPE html>
<html ng-app="app">
<head>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular.min.js"></script>
  <meta charset="utf-8">
  <title>JS Bin</title>
</head>
<body>
 <p ng-controller="MyController">
        <h1>Hello {{clock}}</h1>
    </p>
    
    <script type="text/javascript">
     (function(){
        angular.module("app", []).controller("MyController", MyController);
      
         
        MyController.$inject = ['$scope', '$timeout'];
       
        function MyController($scope, $timeout) {
            $scope.clock = new Date();
            var updateClock = function() {
              $scope.clock = new Date();
            };
            setInterval(function() {
              $scope.$apply(updateClock);
            }, 1000);
            updateClock();
       }
     })();
    </script>
</body>
</html>

JS Bin
http://jsbin.com/vekixa/edit?html,console,output

Jika anda tidak boleh memintas dinding, sila tukar CDN di dalam dinding

Suka +0
Tambah Balasan
曾经蜡笔没有小新
曾经蜡笔没有小新2017-05-15 16:58:52 Tingkat 1

Adalah disyorkan bahawa poster itu mengikuti versi 1.4 (versi sangat penting) 

<!doctype html> 
<html ng-app> 
<head> 
    <meta charset="utf-8"> 
    <title>Simple App</title> 
    <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.4.7/angular.min.js"></script>
</head>
<body>
    <p ng-controller="MyController">
        <h1>Hello {{clock}}</h1>
    </p>
    
    <script type="text/javascript">
        function MyController($scope, $timeout) {
            $scope.clock = new Date();
            var updateClock = function() {
              $scope.clock = new Date();
            };
            setInterval(function() {
              updateClock();
            }, 1000);
      };
    </script>
</body>
</html>

Sama seperti ini. . Sudah tentu anda juga boleh menulis 

<!doctype html> 
<html ng-app> 
<head> 
    <meta charset="utf-8"> 
    <title>Simple App</title> 
    <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.4.7/angular.min.js"></script>
</head>
<body>
    <p ng-controller="MyController">
        <h1>Hello {{updateClock()}}</h1>
    </p>
    
    <script type="text/javascript">
        function MyController($scope, $timeout) {
            $scope.updateClock = function() {
             return new Date();
            };
            setInterval(function() {
              updateClock();
            }, 1000);
      };
    </script>
</body>
</html>
Suka +0
Tambah Balasan
Topik popular
Lagi>
Artikel popular
Tutorial Popular
Lagi>
Tutorial berkaitan
Cadangan popular
Kursus terkini
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan