如何更改点击事件的多个变量的状态?

时间:2015-06-15 07:45:27

标签: angularjs angularjs-ng-click angularjs-ng-show

我创建了一个包含3个链接的页面。我希望当我点击其中一个链接时,相关的行为应该显示出来。

以下是我的代码:

的index.html

<html>
<head>
    <title> SiteMan</title>
    <link rel= "stylesheet" href="stylesheet.css">
    <!--<link rel="stylesheet" type="text/css" href="_styles.css" media="screen">-->
    <!--<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css">-->
    <script src= "http://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js"></script>
    <script src = "tree.js"></script>
</head>
<body ng-app="myApp">
    <div>
        <div id = "header">
            <h1>Siteman RANN 0.1</h1>
        </div>

        <div id ="nav">
            <button> Add Attribute </button>
            <button> Add User </button>
            <button> Add Doccument </button>
        </div>

        <div id = "aside"  style="padding:5px">

                <a href="" ng-click="attr=1">All Attributes</a></br>
                <a href="" ng-click="user=1">All Users</a></br>
                <a href="" ng-click="docs=1">All Document Types</a></br>
        </div>


        <div id = "section">

            <table ng-controller="mainCtrl" ng-show="attr">
                <tr ng-repeat="x in attributes">
                    <td>{{x.name}}</td>
                </tr>
            </table>

            <table ng-controller="mainCtrl" ng-show="user">
                <tr ng-repeat="x in names">
                    <td>{{ x.displayName }}</td>
                </tr>
            </table>

            <table ng-controller="mainCtrl" ng-show="docs">
                <tr ng-repeat="x in extnsion">
                    <td>{{ x.extension }}</td>
                </tr>
            </table>

        </div>

        <div id = "article">
        </div>

        <div id = "footer">
            Copyright &copy; Siteman RANN
        </div>
    </div>
</body>
</html>

我希望如果单击“所有属性”链接,attr = 1,用户和文档应分配值0。这应该发生在所有三个链接上:所有属性,所有用户,所有文档类型。

1 个答案:

答案 0 :(得分:1)

<a href="" ng-click="attr=1;user=0;docs=0;">All Attributes</a></br>
<a href="" ng-click="attr=0;user=1;docs=0;">All Users</a></br>
<a href="" ng-click="attr=0;user=0;docs=1;">All Document Types</a></br>