如何在Angular方法中处理下面的jQuery

-4

下面的简单jQuery不会在我的角度web应用中运行。它在控制台中运行，但在作为外部文件提供时不会被读取。其他脚本在同一个文件中运行，但这不是。有什么想法吗？我如何使用正确的Angular方式重新编写下面的代码（我目前是角度新手）。如何在Angular方法中处理下面的jQuery

$("#button").on("click", function() { 
    $('input.ng-pristine').show(); //class selector for the div to show 
});

来源

2016-04-12 Fred Randall

你把你的代码放在文档准备好了吗？ –

你为什么想在角度应用程序中做到这一点？你为什么不使用ng-click指令？ –

为什么不在角度逻辑中处理这个问题？ – ajmajmajma

后面你会怎么做这角的总体思路是，像这样

//your button 
<button id="button" ng-click="clickButton()">your button </button> 
//your input to hide 
<input ng-show="!hideInput" />

而在控制器

$scope.clickButton = function() { 
     $scope.hideInput = !$scope.hideInput; 
};

现在，我不知道你是否有特殊的用例来显示和隐藏它，但是这个按钮会按原样切换显示/隐藏。如果您在开启和关闭切换它可以简化甚至进一步像这样：

<button id="button" ng-click="hideInput = !hideInput">your button </button>

这可能不适合你，如果你不希望它切换，但这个想法是$ scope.hideInput是布尔值，它控制输入上的ng-show或ng-hide。

来源

2016-04-12 18:26:40 ajmajmajma

-2

正确的方法是使用角指令的

编辑：

角ng-click和ng-show将做的工作：

代码示例：

在html文件：

<body ng-app="example.module"> 
    <div ng-controller="myCtrl"> 
     <button id='button' ng-click="show()"> show it! </button> 
     <input class="pristine" ng-show="visible"> 
    </div> 
</body>

在js文件

：

angular.module('example.module') 
    .controller('myCtrl', function($scope){ 

    $scope.visible = false; 

    $scope.show = function(){ 
     $scope.visible = true; 
     } 

})

来源

2016-04-12 18:16:34

您应该使用的角度指令

<input type="button" value="Click me" ng-click="myFunction()"> 


// In your angular controller 
$scope.myFunction = function() { 
    // do something 
};

来源

2016-04-12 18:19:49

如何在Angular方法中处理下面的jQuery

回答

相关问题