Home > Article > Web Front-end > There are complex operations about MVC in AngularJS

There are complex operations about MVC in AngularJS

亚连Original: 2018-06-14 15:20:231300browse

Below I will share with you an example of complex operations based on MVC in AngularJS. It has a good reference value and I hope it will be helpful to everyone.

The examples are as follows:

<!DOCTYPE html>
<html>
 <head>
  <meta charset="UTF-8">
  <title>AngularJS基于MVC的复杂操作案例</title>
  <script type="text/javascript" src="../js/angular.min.js"></script>
 </head>
 <body>
  <!--ng-app="myapp"定义了一个模块-->
  <p ng-app="myapp" ng-controller="myctrl">
   <p>
    <!--ng-model模型作用-->
    <input type="text" name="name" ng-model="name" />
    <!--提供按钮-->
    <input type="button" value="清空" ng-click="clearVal()" />
   </p>
   <p>
    <!--{{}}等价于ng-bind用于数据显示-->
    hello,{{name}}
   </p>
  </p>
 </body>
 <script type="text/javascript">
  //初始化myapp模块
  var myapp = angular.module("myapp",[]);
  //定义模块的控制器
  //依赖注入，$scope作用域对象，操作当前作用域视图
  myapp.controller("myctrl",["$scope",function($scope){
   //对模型进行初始化赋值
   $scope.name = "你我他学习吧";
   //在作用域提供clearVal点击事件
   $scope.clearVal = function(){
    //模型设置为空
    $scope.name = "";//清空输入框内容
   }
  }]);
 </script>
</html>

The above is what I compiled for everyone. I hope it will be helpful to everyone in the future.

About the implementation of the dispatch mechanism between Vue2.0 parent and child components (detailed tutorial)

How to implement it using vue-ssr Server-side rendering

How to use history to control routing in react-router (detailed tutorial)

How to print page content using jqprint

Use js to implement WeChat to evoke Alipay to receive red envelopes (detailed tutorial)

How to use Gulp to implement static web page modularization? How to do it specifically?

How to integrate vux in vue.js to implement pull-up loading and pull-down refresh

In webpack, a 404 problem is reported regarding the vue project resource file ( Detailed tutorial)

Using webpack vue2 for project construction

How to implement multiple inheritance in JavaScript

The above is the detailed content of There are complex operations about MVC in AngularJS. For more information, please follow other related articles on the PHP Chinese website!

Statement：

The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn

Previous article：p5.js makes fireworks bloom animationNext article：p5.js makes fireworks bloom animation

See more

There are complex operations about MVC in AngularJS

Related articles