Ng模型与Cookie

时间:2015-06-21 13:01:38

标签: javascript angularjs cookies angular-ngmodel

我尝试从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();
}]);

但是它不起作用,我一直在努力学习角度。 感谢

2 个答案:

答案 0 :(得分:1)

我建议你在app模块中创建一个服务:

$pod --version

在控制器中注入shareDataService以设置和获取cookie值 为:

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
};
}]);

工作小提琴:https://jsfiddle.net/y7dxa6n8/10/

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

答案 1 :(得分:1)

好的,再次检查你的代码,这是你的答案 https://jsfiddle.net/wz3kgak3/

  1. 问题 - 语法错误:通知控制器定义,不使用[]作为第二个参数 如果您在控制器中使用[],则必须以这种方式使用它:

    myApp.controller(&#39; MyController&#39;,[&#39; $ cookies&#39;,功能($ cookies){ .... }]);

  2. 这&#34; long&#34;格式是javascript uglyfier安全,当param $cookies将变为ab左右,并且将无法访问$cookies,因此您告诉控制器:&#34 ;我函数中的第一个参数是cookies

    1. 问题:你使用的是角度1.3.x,$ cookies中没有方法PUT或GET,这种方法只能在角度1.4+中使用,所以你需要以旧的方式使用它:{{1} }和getter:$cookies.user = 'something';

    2. 问题 - 您没有存储该Cookie值,模型已更新,但Cookie未自动绑定,因此请使用$ watch查看var something = $cookies.user;中的更改并将其存储:

      user

    3. 或通过某些事件(点击,提交或我不知道在哪里)

      编辑:$ scope的完整工作示例 https://jsfiddle.net/mwcxv820/