Angular的服務是什麼？我如何使用？

-1

我已經在控制器中創建了一個函數和一條警報消息，並在頁面中調用它。頁面加載消息警報兩次。Angular的服務是什麼？我如何使用？

角度控制器運行兩次？

app.js 在那裏我有添加的模塊和js並調用它的index.html的。

angular.module('flapperNews', []) 
 
.controller('MainCtrl', [ 
 
'$scope', 
 
function($scope){ 
 
    $scope.test = 'Hello world!'; 
 
    $scope.posts = [ 
 
    {title: 'post 1', upvotes: 5}, 
 
    {title: 'post 2', upvotes: 2}, 
 
    {title: 'post 3', upvotes: 15}, 
 
    {title: 'post 4', upvotes: 9}, 
 
    {title: 'post 5', upvotes: 4} 
 
]; 
 

 
$scope.addPost=function(){ 
 
    if(!$scope.title ||$scope.title==='')return; 
 
    $scope.posts.push({title: $scope.title 
 
    , upvotes: 0}); 
 
    $scope.title=''; 
 
} 
 
$scope.incrementUpvotes = function() { 
 
    //post.upvotes += 1; 
 
    alert('dfsakjlkdsjflkdsaj'); 
 
}; 
 

 

 

 

 
}])

<html> 
 
<head> 
 
    <title> News</title> 
 
    <link href="//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css" rel="stylesheet"> 
 

 
    <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.2.19/angular.min.js"></script> 
 
    <script src="app.js"></script> 
 
    <style> .glyphicon-thumbs-up { cursor:pointer } </style> 
 
</head> 
 
<body ng-app="flapperNews" ng-controller="MainCtrl"> 
 
    <div class="row"> 
 
    <div class="col-md-6 col-md-offset-3"> 
 

 
     <div class="page-header"> 
 
     <h1>Flapper News</h1> 
 
     </div>  
 
     {{incrementUpvotes()}} 
 

 
    </div> 
 
    </div> 
 
</body> 
 
</html>

來源

2014-12-21 Yogendra - eCommerce Developer

也許你可以點擊[編輯]並將相關部分的代碼添加到問題中？ – nnnnnn

哪裏是代碼？我們如何知道沒有代碼？ – harishr

你使用$ routeProvider嗎？它可能會在模板被渲染兩次時生效。 – SET

控制器不運行兩次在這裏 - 你可以通過將console.log控制器功能檢查。

這裏發生的是Angular調用一個監視表達式 - 在你的情況下，在每個摘要循環中調用{{incremetUpvotes()}}。這就是Angular是如何工作的，這就是爲什麼讓您的ViewModel監控功能非常快速和冪等（即每次調用時表現相同而不會產生副作用，如警報或增量遞增）是非常重要的。

這裏是您的plunker（稍作更新），它說明了如何按下與incrementUpvotes()函數無關的按鈕，但仍會導致它被調用。

因此，只有增加響應的給予好評計數器的動作，像ng-click：

<div>{{post.upvotes}}</div> 
<button ng-click="incrementUpvotes(post)"> upvote </div>

來源

2014-12-22 01:24:02

在初始化你的應用程序運行的角度結合自己的價值觀的$消化週期。它實際運行它至少兩次，最多10次，然後退出。 Angular會這樣做以驗證您的模型中的傳遞更改已完全傳播並且您的模型已解決。

- 這就是綁定發生兩次並且函數被調用兩次的原因。

來源

2014-12-22 03:27:03 byrdr

雖然這將工作，有一個函數incrementUpvotes（）有副作用，並使用1次綁定是可怕的設計國際海事組織，並不是非常'angular-y'。這更像是舊JSP servlet做事的方式。 – GBa

我同意，它不是非常有角度的。我實際上並不認爲一次性約束會解決這個問題，因爲它會等待該項目的解決。 – byrdr

Angular的服務是什麼？我如何使用？

回答

相關問題