Jes*_*zie 17 html javascript jquery angularjs
我很困惑,在创建我的应用程序时开始.
当我单击添加按钮时,我想要显示一个表单 - 我是否将div添加到该按钮？
我该怎么攻击这个？
码:
<body>
<div id="wrap">
<!-- Begin page content -->
<div classa="container">
<div class="page-header">
<h1>Birthday Reminders</h1>
</div>
<p>Data Here</p>
</div>
<div id="push"></div>
</div>
<div id="footer">
<div class="container">
<a href="#">Add</a>
</div>
</div>
<script type="text/javascript" src="js/cordova-2.5.0.js"></script>
<script type="text/javascript">
app.initialize();
</script>
</body>
Jos*_*ler 70
好的,从顶部!:-)
首先,你必须告诉AngularJS你正在使用它.该body标签是一个很好的地方一样:<body ng-app="myApp">.这告诉AngularJS使用一个名为myApp应用程序根目录的模块.那么现在让我们来定义:
// app.js
var app = angular.module( 'myApp', [] );
第二个参数是依赖项数组.我们现在不用担心.所以现在我们有一个模块.AngularJS是一个MVC框架,所以我们还需要在某处定义一个控制器.我们将其添加到我们的app.js文件中:
app.controller( 'MainCtrl', function( $scope ) {
// we control our app from here
});
该$scope变量是我们如何胶水我们的控制器的逻辑视图.说到这个视图,我们必须告诉AngularJS在某个地方使用这个控制器.让我们body再次编辑标签:
<body ng-app="myApp" ng-controller="MainCtrl">
繁荣!我们的应用程序.所以现在AngularJS已经全部设置好了,所以我们可以解决你的问题.
你想在某个动作上出现一些东西.对此有一个指令ngShow.当条件为真时,它将显示其中的内容:
<form ng-show="visible">
什么是visible？那是一个表达.在这种情况下,它只是一个变量.定义在哪里？在我们的范围!
app.controller( 'MainCtrl', function( $scope ) {
$scope.visible = false;
});
好的,现在它开始了false; 我们如何true在点击按钮时将其更改为？这个被调用的指令ngClick也有一个表达式:
<a class="btn" ng-click="visible = true">Show the Form</a>
在这种情况下,我们的表达式将visible变量更改为true.然后立即显示表单!这是一个完整的Plunker:http://plnkr.co/edit/Kt4dR2tiTkShVYWCqQle？p = preview
欢迎来到AngularJS!
以下是您应该了解的一些补充资源:
并加入我们的邮件列表!我们是好人.