高潮毛片无遮挡免费,,,,,成年美女黄网站色大片

国产av日韩一区二区三区精品,成人性爱视频在线观看,国产,欧美,日韩,一区,www.成色av久久成人,2222eeee成人天堂

angular.js - angularjs scope.$watch取不到input變化的值

僅有的幸福 2017-05-15 16:49:37

969

我想用angularjs和my97datepicker做一個(gè)東西，寫了一個(gè)direcitve，在點(diǎn)擊選擇完時(shí)間之后，把值同步到scope上面。描述的有點(diǎn)亂，看下主要代碼：

javascriptvar datepicker=angular.module("datepicker",[]);
datepicker.controller("datepickerCtrl",function($scope){
    $scope.date="2014-10-14";
});
datepicker.directive("datePicker",function(){
    return {
        restrict:"A",
        link:function(scope,element,attr){
            element.bind("click",function(){
                window.WdatePicker();
            });
            //問題在這里，無法取到變化的值，而且加上這個(gè)，連初始的值都無法顯示出來。
            scope.$watch(attr.value,function(newVal){
                scope.date=newVal;
            });
        }
    };
});

在線地址：http://jsfiddle.sinaapp.com/4zz6nvadg/embedded。初學(xué)angularjs，每次寫directive都是卡在$watch這里。

僅有的幸福

全部回復(fù)(5)

洪濤2017-05-15 16:51:37 5 樓

我不知道怎么解決，因?yàn)槟阌玫哪莻€(gè)插件我沒有用過，現(xiàn)在也沒時(shí)間去研究它。不過我可以告訴你問題出在哪里，你試著自己找找解決方案吧。先看截圖：

先注釋了 $watch 相關(guān)的代碼，以確保插件正確執(zhí)行
注意下面：2014-10-14 出現(xiàn)在 DOM 的哪里了嗎？
在 $watch 部分你監(jiān)視的是 attr.value，然而根據(jù)截圖可以發(fā)現(xiàn)插件設(shè)定的日期根本就不是保存在 input[value] 這里，無論如何 input[value] 部分你監(jiān)視的是 attr.value，然而根據(jù)截圖可以發(fā)現(xiàn)插件設(shè)定的日期根本就不是保存在 input[value] 這里，無論如何 input[value] 都是空值
因此，$watch 所做的僅僅是讀取一個(gè)不存在的值，并且覆蓋了 model，這就是為什么加上 $watch 部分之后，連 model 所做的僅僅是讀取一個(gè)不存在的值，并且覆蓋了 model，這就是為什么加上

model

input[value] 去，要么反過來，找到正確的地方去取值去 $watch知道原因之后，解決辦法就簡單了，要么讓插件把你想要的值寫到 input[value] 去，要么反過來，找到正確的地方去取值去

，具體辦法自己去查詢插件的文檔或源碼吧。

$watch吃了晚飯，幫你看一下插件的源代碼，實(shí)際上人家提供了幾個(gè)事件回調(diào)函數(shù)，而且你不必非用

的，代碼如下：

var datepicker=angular.module("datepicker",[]);
datepicker.controller("datepickerCtrl",function($scope){
  $scope.date="2014-10-14";
});
datepicker.directive("datePicker",function(){
  return {
    restrict:"A",
    link:function(scope, element, attr){
      element.bind("click", function () {
        window.WdatePicker({
          onpicked: function () {
            scope.$apply(scope.date = this.value);
          }
        });
      });
    }
  };
});

Demo: http://jsfiddle.sinaapp.com/4zz6n9usy

$watch想用

也可以，這樣寫：

var datepicker=angular.module("datepicker",[]);
datepicker.controller("datepickerCtrl",function($scope){
  $scope.date="2014-10-14";
});
datepicker.directive("datePicker",function(){
  return {
    restrict:"A",
    link:function(scope, element, attr){
      element.bind("click", function () {
        window.WdatePicker({
          onpicked: function () { scope.$digest(); }
        });
      });
      scope.$watch(
        function () { return element[0].value },
        function (newValue) { scope.date = newValue; }
      );
    }
  };
});

Demo: http://jsfiddle.sinaapp.com/4zz6n9t9q

element[0].value注意，這里第一個(gè)參數(shù)不能是直接

，因?yàn)檫@個(gè)值是一個(gè) primitive string，而不是 angular 封裝過的對(duì)象，所以要用一個(gè) getter 函數(shù)顯式的去獲取，否則你拿不到的。

scope.$digest()，否則 scope.date而且這里還必須得依賴插件的回調(diào)函數(shù)做一下

不會(huì)自動(dòng)更新。由此可見，還是第一個(gè)例子更簡單，性能也更好。??

點(diǎn)贊 +0

添加回復(fù)

PHPzhong2017-05-15 16:51:37 4 樓

不知道為何要這么用，這里你需要明確一個(gè)概念，屬性和 scope 是不同的，如果要綁定屬性值到 scope 中，需要在 directive 中去做 scope 的聲明，有以下三種方式：

=attr 雙向
@attr 單向
&attr 函數(shù)

按照你的思路，可能是下面的方式：

scope: {
  value: '=value'
}

但即使是做了綁定，還要明白這個(gè)元素的 value 的值變更并不是 Angular 默認(rèn)會(huì)做監(jiān)控的，這個(gè)綁定只是說要去綁定這個(gè)屬性值對(duì)應(yīng)的變量，當(dāng)然無法 watch 到 value 的變更。
其實(shí)用 ng-model 和 ng-change 足夠了。

最終可能是這樣：