使用 ng-click 在 Angular js 中显示 div

Question

所以我在 html 框中有一个 link，当单击 link 时，我试图让它显示一组全新的 div 来替换当前的 div。我试过了：

<a href="" ng-click="Search('Show Products A B C')" > Show Products </a>

Search 调用控制器中的函数，其中 returns A B C 产品的数据，然后使用

显示

<div ng-repeat="products in Search( 'Show Products A B C')" </div>

我基本上是想做这样的事情：

  <div  ng-repeat=" href="" ng-click="Search('Show Products A B C')"> </div>

这不是我理解的正确语法。但是现在什么也没有发生。基本上从那个 ng-click 我想调用那部分代码 (ng-repeat) 因为现在它们没有连接。谢谢

Answer 1

ng-repeat 将响应其参数的变化，但您的参数是一个函数 Search()。我建议如下：在您的搜索功能中：

$scope.Search = function(arg) {
    // do your search logic
    $scope.productList = <search result list>
}

然后在 html

<div ng-repeat="products in productList" </div>

Answer 2

你应该做的是将一些 数组或对象 A 绑定到 $scope，然后当你调用搜索时你 更新 A，更改将反映在您的视图中

$scope.show=true;
$scope.products =[A,B,C];
$scope.Search = function() {
    // do list update
    $scope.show=false;
    $scope.products =[D,E,F] ;
}

您还需要将 ng-repeat 更改为：

<div ng-repeat="product in products" </div>

并将ng-show添加到第一个link:

<a href="#" ng-show = "show" ng-click="search();">Click Me</a>

编辑：

检查 this fiddle 以获取工作示例。

编辑：

Fiddle 已更新以反映最新更改。

使用 ng-click 在 Angular js 中显示 div

Using ng-click to show divs in Angular js

javascript

html

angularjs

angularjs-ng-click

ng-show