1

我用文件夹和子文件夹实现了某种 FilePanel。

从 Chrome 开发人员工具中，我可以看到它ui.item.sortable.droptarget的data属性为parent-folder-id == 2，但是当我尝试在代码中（通过 jquerydata方法）访问它时，它返回 10（我最近所在的另一个文件夹的父级的值）。为什么它没有得到更新？当我移动到另一个文件夹时 -vm.parentId根据该文件夹的服务器值分配新值。DOM 已正确更新...

<ul ui-sortable="vm.sortableOptions"
        ng-model="vm.cache.items"
        data-parent-folder-id="{{vm.parentId}}">

在此处输入图像描述

稍后添加：即使我将 .data() getter 更新为ui.item.sortable.droptarget.data("parentFolderId")它仍然返回10

更新 2：添加了 plunker 演示： http ://plnkr.co/edit/14XfBOTFuJZ0oSy2ozqh?p=preview

<html ng-app="plunker">

  <head>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.6/angular.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.0.0-alpha1/jquery.min.js"></script>
    <script src="app.js"></script>
  </head>

  <body ng-controller="MainCtrl">
    <div class="xxx" data-parent="{{parentId}}"></div>
    <button ng-click="getParentId()">Get Parent Id</button>
    <br>
    <button ng-click="setParentId(15)">Set Parent Id to 15</button>
    <br>
    <button ng-click="getParentId()">Get Parent Id</button>
    <br>
    {{parentId}}
  </body>

</html>

应用程序.js

var app = angular.module('plunker', []);

app.controller('MainCtrl', function($scope, $element) {

  activate();

  function activate() {
    $scope.parentId = 10;
  }

  $scope.setParentId = function(number) {
    $scope.parentId = number;
  }

  $scope.getParentId = function() {
    $scope.parentId = $($element).find('.xxx').data('parent');
  }

});

当您单击此序列中的按钮时：Set - Get-data值成功更新。但是，当您单击另一个序列时：Get - Set - Get- 出现与我之前的代码相同的问题 - 在获取值时使用新值更新值后 - 旧值返回。

4

2 回答 2

1

这是受此 SO 问题启发的解决方案： get wrong value in data attribute jquery

ui.item.sortable.droptarget.attr("data-parent-folder-id")

基本上讨厌的 jQuery 所做的 - 它缓存数据值，然后只返回旧的值......所以解决方案是根本不使用data方法:)

这是 .data() 的记录行为：http: //api.jquery.com/data/#data-html5

data- 属性在第一次访问 data 属性时被拉取，然后不再被访问或改变（然后所有数据值都存储在 jQuery 内部）。

于 2015-09-25T15:27:39.483 回答
0

在 angularJs 中，你不需要做所有的 jQuery 工作，因为模型会立即绑定到 html 元素。

实际上，使用 angularJs，您甚至根本不需要 jQuery。

您不必获取属性的值，getParentId因为它已经显示在您的{{parentId}}.

该属性是作用域的，并且存在于您的控制器MainCtrl中。

要了解绑定系统的真正工作原理，您可以使用这个plunker。

如您所见，{{parentId}}由于数据绑定，更改文本框中的值会更改您的值。

这是实现的using ng-model="parentId"

于 2015-09-25T15:08:51.927 回答