(17.06.12)MVC、ライブラリとフレームワークの違い、AngularJS、Angularが提供する方法、angularのコア、Directive、Controller、Filter、インタラクション

3336 ワード

MVC
   M       Module             
   V       View               
   C       Controller         

フロントエンド開始用MVC
    M                     
    V                   DOM  
    C                     

原生でMVCを書く必要はありません.誰もがMVCを知っているわけではなく、雇用需要が高くなっています.    2.スタイルが統一されていない
ライブラリとフレームワークの違いは?
                                JQuery
                            Angular

AngularJS    MVVMのフレームワーク
    Angular火.誰かが押しているGoogle
自分で作る人が少なくなった.更新します.ゞ        主版.ゞ次のバージョン改訂番号
        1.2.x           
                  
        1.3.x               
                javascript  
        2.x
                TypeScript


  MVP         MV*
プロセス向け、データ向け
すべてのインタラクションがもたらす苦痛を解決することに力を入れています.データに関心を持つだけでいい.
公式サイト:https://angularjs.org/ダウンロード:https://code.angularjs.org/ドキュメント:https://code.angularjs.org/1.5.8/docs/api
Function      Angularが提供する方法
    angular.bind              this

    angular.bootstrap         angular  

    angular.copy                

    angular.element          jquery

    angular.equals                

    angular.forEach           

    angular.fromJson

    angular.isArray                

    angular.module          angular  

データはすべて
        ng-app            angular  
                     
        ng-model           
        ng-bind             

        ng-bind     。
         :{{}}

Angularのコア:
Directiveコマンド
    ng-app
    ng-model
    ng-bind
    ng-init            
    ng-click          
    ng-repeat         
        {{$index}}        
        {{$first}}            
        {{$last}}              
        {{$even}}             
        {{$odd}}              

    配列に重複があると問題があります.          解決:
    ng-show           
    ng-hide           
    ng-if                   ,      

    ng-controller      


コントローラ
    let app = angular.module('  ',[  ]);

    app.controller('    ',($scope)=>{
        $scope             
    });

Filter
    {{item.price|currency}}
    currency              
        {{item.price|currency:'¥'}}
    date                  

    filter                 

    limitTo                 

    number              1004354548

Angularの問題は、データが変更されましたが、DOMはレンダリングされていません.
サービス
相互作用
    $http  

    GET
        $http.get('url',{
            params:{
                  
            }
        }).then((res)=>{
            res.data              
        },(err)=>{

        });
    POST
        $http({
            method:'POST',
            url:'',
            data:{
                  
            },
            headers:{
                'Content-Type':'application/x-www-form-urlencoded'
            },
            transformRequest:function(data){
                var arr = [];
                for(var key in data){
                    arr.push(key+'='+data[key]);
                }
                return arr.join('&');
            }
        }).then((res)=>{
            res.data              
        },(err)=>{

        });