javascript - 带有 Cookie 的 Ng 模型

Question

我正在尝试从 angular.js 主页获取第一个示例并添加 cookie 支持。

这是我目前所拥有的:https://jsfiddle.net/y7dxa6n8/8/

它是:

<div ng-app="myApp">
  <div ng-controller="MyController as mc">
    <label>Name:</label>
    <input type="text" ng-model="mc.user" placeholder="Enter a name here">
    <hr>
    <h1>Hello {{mc.user}}!</h1>
  </div>
</div>

var myApp = angular.module('myApp', ['ngCookies']);

myApp.controller('MyController', [function($cookies) {

           this.getCookieValue = function () {
                   $cookies.put('user', this.user);
                   return $cookies.get('user');
            }

           this.user = this.getCookieValue();
}]);

但是不行，我一直在努力学习angular。 谢谢

Answer 1

我建议您在应用模块中创建这样的服务:

app.service('shareDataService', ['$cookieStore', function ($cookieStore) {

var _setAppData = function (key, data) { //userId, userName) {
    $cookieStore.put(key, data);
};

var _getAppData = function (key) {
    var appData = $cookieStore.get(key);
    return appData;
};
return {
    setAppData: _setAppData,
    getAppData: _getAppData
};
}]);

在 Controller 中注入(inject)shareDataService来设置和获取cookie值 作为:

//set
var userData = { 'userId': $scope.userId, 'userName': $scope.userName };
shareDataService.setAppData('userData', userData);

//get
var sharedUserData = shareDataService.getAppData('userData');
$scope.userId = sharedUserData.userId;
$scope.userName = sharedUserData.userName;

工作 fiddle :https://jsfiddle.net/y7dxa6n8/10/

我在两个 Controller 之间使用了 cookie 服务。填写文本框以查看其使用方式。