In AngularJS gibt es komplexe Vorgänge zu MVC-js-Tutorial-php.cn

In AngularJS gibt es komplexe Vorgänge zu MVC

亚连

Freigeben： 2018-06-14 15:20:23

Original

1387 Leute haben es durchsucht

Im Folgenden werde ich Ihnen ein Beispiel für komplexe Operationen basierend auf MVC in AngularJS vorstellen. Es hat einen guten Referenzwert und ich hoffe, dass es für alle hilfreich sein wird.

Die Beispiele sind wie folgt:

<!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>

Nach dem Login kopieren

Das Obige habe ich für alle zusammengestellt. Ich hoffe, es wird für alle hilfreich sein Zukunft.

Verwandte Artikel:

Über die Implementierung des Versandmechanismus zwischen übergeordneten und untergeordneten Vue2.0-Komponenten (ausführliches Tutorial)

Anleitung Implementieren Sie es mit vue-ssr. Serverseitiges Rendering

So verwenden Sie den Verlauf, um das Routing im React-Router zu steuern (ausführliches Tutorial)

Wie So drucken Sie Seiteninhalte mit jqprint

Verwenden Sie js, um WeChat zu implementieren, um Alipay zum Empfang roter Umschläge zu veranlassen (ausführliches Tutorial)

So verwenden Sie Gulp Wie kann ich die statische Webseitenmodularisierung konkret umsetzen?

So integrieren Sie Vux in vue.js, um Pull-Up-Laden und Pull-Down-Aktualisierung zu erreichen

404-Problem im Webpack bezüglich der gemeldet vue-Projektressourcendatei (Detailliertes Tutorial)

Webpack+vue2 für die Projektkonstruktion verwenden

So implementieren Sie Mehrfachvererbung in JavaScript

Das obige ist der detaillierte Inhalt vonIn AngularJS gibt es komplexe Vorgänge zu MVC. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!