在ng-click AngularJS上动态更改div内容 [英] Change div content dynamically on ng-click AngularJS

问题描述

我想在内容 div 中显示一些数据和表格，这取决于您在左侧导航栏中选择的类别。
因此，如果我改变了类别，内容div的显示内容应该改变。

这是我在 Plunkr 。

但似乎连这个简单的例子都行不通。

所以我有两个问题：

1。）我该如何解决这个示例代码运行？

但更重要的是：

<2>。是否有更好的方法来更改内容div类别？

解决方案

我从代码中移除了'this'元素，并将ng-view改为ng-show。

 < div> 
< div ng-show =showApple> {{content}}< / div> 
< div ng-show =showBanana> {{content}}< / div> 
< div ng-show =showOrange> {{content}}< / div> 
< / div> 
  

您将div的名称命名为content有问题，所以我也删除了它。

我相信这不是一个完美的解决方案，但现在它可以工作。

link to plnkr

I want to display some data and tables in the content div which depends on which category you choose on the left hand side navigation. So if I change the category also the displayed content of the content div should change.

Here is my code on Plunkr.

But it seems that not even this simple example is working.

So I have two Questions:

1.) How can I fix this example code to run ?

But more important:

2.) Is there a better way to change the content div when you change the category ?

解决方案

I removed 'this' elements from code and also changed ng-view to ng-show.

<div>
  <div ng-show="showApple">{{content}}</div>
  <div ng-show="showBanana">{{content}}</div>
  <div ng-show="showOrange">{{content}}</div>
</div>

There was something wrong with that you named your div class "content" so I removed that also.

I am sure it isn't a perfect solution but now it works.

link to plnkr

这篇关于在ng-click AngularJS上动态更改div内容的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！