更新服務內部的變量

對我對你來說真的很愚蠢，我一直在看這個代碼，沒有結果。更新服務內部的變量

我有一個簡單的文本框，通過控制器並更新服務內的變量（該服務最終將從其他地方獲取/更新數據）。

目前，我能夠將變量值一直檢索到視圖並且它可以工作，但是文本框無法更新服務中的變量以便在視圖中顯示新的變量值再次....

我真的很感激任何幫助，並希望我有道理！

// APP/APP.JS 
 
(function(){ 
 
    var app = angular.module('appMod', ['ngRoute', 'ngAnimate']); 
 

 
    app.config(function ($routeProvider) { 
 
     $routeProvider 
 
      .when('/', 
 
      { 
 
       controller: 'introController', 
 
       templateUrl: 'app/partials/intro.html' 
 
      }) 
 
      .otherwise({ redirectTo: '/' }); 
 
    }); 
 

 
    app.controller('nameController', function($scope, dataService) { 
 

 
     var nameValue; 
 

 
     this.name = dataService.getName(); 
 

 
     this.submitName = function(nameVal) { 
 
      nameValue = this.nameCtrl.nameVal; 
 
      dataService.setName(nameValue); 
 
     }; 
 

 

 
    }); 
 

 
    app.controller('introController', function($scope, dataService) { 
 

 
     this.name = dataService.getName(); 
 

 
    }); 
 

 
    app.service('dataService', function() { 
 
     var name = "f"; 
 
     this.getName = function() { 
 
      return name; 
 
     }; 
 

 
     this.setName = function(nameVal) { 
 
      name = nameVal; 
 
     }; 
 
    }); 
 

 

 
})();

<!-- INDEX.HTML --> 
 
<!DOCTYPE html> 
 

 
<html ng-app="appMod"> 
 
<head> 
 
    <link rel="stylesheet" type="text/css" href="content/css/normalize.css"> 
 
    <link rel="stylesheet" type="text/css" href="content/css/bootstrap.min.css"> 
 
    <link rel="stylesheet" type="text/css" href="content/css/style.css"> 
 
    <link rel="stylesheet" type="text/css" href="content/css/animation.css"> 
 
    <script type="text/javascript" src="http://code.jquery.com/jquery.min.js"></script> 
 
    <script type="text/javascript" src="scripts/bootstrap.min.js"></script> 
 
    <script type="text/javascript" src="scripts/angular.min.js"></script> 
 
    <script type="text/javascript" src="scripts/angular-route.min.js"></script> 
 
    <script type="text/javascript" src="scripts/angular-timer.min.js"></script> 
 
    <script type="text/javascript" src="scripts/angular-animate.min.js"></script> 
 
    <script type="text/javascript" src="app/app.js"></script> 
 
</head> 
 
<body> 
 
<div class="container"> 
 
    <div class="row" ng-controller="nameController as nameCtrl"> 
 
     <img src="content/images/sitelogo.png" class="logo"> 
 
     <h2 class="welcomeMessage fade">Welcome <span class="fade" ng-show="!nameCtrl.name == ''">{{nameCtrl.name}}</span><span class="inline fade" ng-hide="nameCtrl.name !== ''">Friend</span> <small>(We like to get personal!)</small></h2> 
 
     <div class="namebox fade"> 
 
      <h2>Welcome <small class="fade">Please type your name</small></h2> 
 
      <form class="fade"> 
 
       <div class="form-group"> 
 
        <input type="text" class="form-control" ng-model="nameCtrl.nameVal" autofocus> 
 
       </div> 
 
       <button type="submit" style="width:100%;" class="btn btn-default fade" ng-click="nameCtrl.submitName()" >Submit</button> 
 
      </form> 
 
     </div> 
 
    </div> 
 
</div> 
 
    <div ng-view></div> 
 
</body> 
 
</html>

來源

2015-02-06 Marshiewooooooo

我假設'name = nameVal（）;'應該是'name = nameVal;' – tasseKATT 2015-02-06 20:10:26

我已經改變了它，但仍然不起作用：/請欣賞它！ – Marshiewooooooo 2015-02-06 20:12:14

我知道，但你應該編輯這個問題，否則人們嘗試你的代碼將會得到'TypeError：string不是一個函數。 – tasseKATT 2015-02-06 20:23:10

您需要在輸入要綁定的名稱，而不是nameVal

然後，只需通過在你的setName電話，我不認爲代碼的其餘部分是需要在那裏，你可以擺脫nameValue變種。

this.submitName = function() { 
     dataService.setName(this.name); 

    };

的nameValue VAR是本地控制器，而不是可在$範圍綁定到你的觀點，因此，即使你改變它，認爲根本不知道這件事，因爲它看不見那個變種

來源

2015-02-06 20:31:32 mindparse

你爲什麼不看比賽？ ;）只是嘗試你的建議，如果這是正確的，我會打勾！ :)謝謝 – Marshiewooooooo 2015-02-06 20:42:20

我會很快，不得不記錄它，並觀看後 – mindparse 2015-02-06 20:43:40

非常感謝，它的工作:)我顯然還是有一些學習做大聲笑 – Marshiewooooooo 2015-02-06 20:45:16

更新服務內部的變量

回答

相關問題