jQuery 克隆和附加功能在 AngularJS 指令中没有按预期工作

Question

在我的应用程序中，我尝试构建一个购物车。您可以在此代码笔中看到该应用程序：http://codepen.io/summerfreeze/pen/VjqJYW。它几乎可以工作，但我正在为最后一部分而苦苦挣扎。我想要 "ADD ORDER LINE" 按钮在现有订单行下添加另一个订单行。我正在尝试使用 jQuery:

  myApp.directive('myDirective', function($scope) {
    $scope.addline = function() {
      $(".orderline").clone().appendTo('.main');
    };
    return addline();
  });

但这似乎不起作用。如果有人能查看代码并告诉我我犯了什么错误，我将不胜感激。

Answer 1

据我所知，您不应附加到 #main，而应附加到 #main div[0]

Answer 2

不确定您为什么要使用指令。我从你的代码中删除了它并且它有效。您还有其他错误，但我猜您可以处理这些错误。这是 link 到修改版本

new codepen version

   $scope.addline = function(){
    $(".orderline").clone().appendTo('.main');
  };

正如其他人所建议的那样，为了遵循干净的代码标准，请避免在 AngularJS 中使用 jQuery 代码，及时会导致问题。

jQuery 克隆和附加功能在 AngularJS 指令中没有按预期工作

jQuery clone and append function isn't working as expected in AngularJS directive

javascript

jquery

angularjs

angular-directive