angularjs でコントローラーと命令の間の対話を実装する方法のサンプルコード
この記事では主に angularjs での controller のインタラクションの実装方法について詳しく説明します。興味のある方は参考にしてください
次の DOM 構造がある場合:
<p ng-controller="MyCtrl"> <loader>滑动加载</loader> </p>
同時に、コントローラーには次の署名があります:
var myModule = angular.module("MyModule", []);
//首先定义一个模块并在模块下挂载控制器，第二个参数为一个数组，其中函数前面的参数都是会被注入到函数形参上面的
myModule.controller('MyCtrl', ['$scope', function($scope){
$scope.loadData=function(){
console.log("加载数据中...");
}
}]);同時に、命令の署名は次のとおりです:
myModule.directive("loader", function() {
return {
restrict:"AE",//Element,Attribute
link:function(scope,element,attrs){
element.bind('mouseenter', function(event) {
//scope.loadData();
// scope.$apply("loadData()");
// 注意这里的坑，howToLoad会被转换成小写的howtoload
});
}
}
});この時点で、命令はスコープを通じてコントローラーへの呼び出しを完了できます。 .loadData またはscope.$apply 。しかし、2 つのコントローラーがあり、$scope のメソッドが 2 つのコントローラーで異なる場合はどうなるでしょうか?
var myModule = angular.module("MyModule", []);
//首先定义一个模块并在模块下挂载控制器，第二个参数为一个数组，其中函数前面的参数都是会被注入到函数形参上面的
myModule.controller('MyCtrl', ['$scope', function($scope){
$scope.loadData=function(){
console.log("加载数据中...");
}
}]);
myModule.controller('MyCtrl2', ['$scope', function($scope){
$scope.loadData2=function(){
console.log("加载数据中...22222");
}
}]);この時点で、上記のメソッドに従うと、問題が発生します。には、loadData はありませんが、loadData2 のみがあります! 現時点では、次の命令を使用して 属性 をカスタマイズする必要があります!
2 つのコントローラー コントローラー、つまり MyCtrl と MyCtrl2 を定義しました。両方のコントローラーには、独自に定義された命令を使用します。 load:
<!doctype html>
<html ng-app="MyModule">
<head>
<meta charset="utf-8">
</head>
<body>
<!--第一个控制器MyCtrl-->
<p ng-controller="MyCtrl">
<loader howToLoad="loadData()">滑动加载</loader>
</p>
<!--第二个控制器MyCtrl2-->
<p ng-controller="MyCtrl2">
<loader howToLoad="loadData2()">滑动加载</loader>
</p>
</body>
<script src="framework/angular-1.3.0.14/angular.js"></script>
<script src="Directive&Controller.js"></script>
</html>コントローラー コードを次のようにカスタマイズしました:
var myModule = angular.module("MyModule", []);
//首先定义一个模块并在模块下挂载控制器，第二个参数为一个数组，其中函数前面的参数都是会被注入到函数形参上面的
myModule.controller('MyCtrl', ['$scope', function($scope){
$scope.loadData=function(){
console.log("加载数据中...");
}
}]);
myModule.controller('MyCtrl2', ['$scope', function($scope){
$scope.loadData2=function(){
console.log("加载数据中...22222");
}
}]);
//在模块下挂载一个loader指令
myModule.directive("loader", function() {
return {
restrict:"AE",//Element,Attribute
link:function(scope,element,attrs){
element.bind('mouseenter', function(event) {
//scope.loadData();
// scope.$apply("loadData()");
// 注意这里的坑，howToLoad会被转换成小写的howtoload
// scope.$apply(attrs.howtoload);
//其中scope为POJO，但是有一系列的工具方法如$watch,$apply等
});
}
}
}); 明らかに、ここには MyCtrl と MyCtrl2 という 2 つのコントローラーがあります。この時点で、命令はどのコントローラーを呼び出すかをどのように認識するのでしょうか? 、この属性を使用してさまざまなコントローラーの呼び出しを判断し、さまざまなコントローラーで命令を呼び出すことができます。
概要: 命令が異なるコントローラーと対話できるようにするためです。設定項目はコマンドに対して定義されます。これがコマンドとコントローラー間のデータ対話の原理です。
以上がangularjs でコントローラーと命令の間の対話を実装する方法のサンプルコードの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。
ホットAIツール
Undresser.AI Undress
リアルなヌード写真を作成する AI 搭載アプリ
AI Clothes Remover
写真から衣服を削除するオンライン AI ツール。
Undress AI Tool
脱衣画像を無料で
Clothoff.io
AI衣類リムーバー
AI Hentai Generator
AIヘンタイを無料で生成します。
人気の記事
ホットツール
メモ帳++7.3.1
使いやすく無料のコードエディター
SublimeText3 中国語版
中国語版、とても使いやすい
ゼンドスタジオ 13.0.1
強力な PHP 統合開発環境
ドリームウィーバー CS6
ビジュアル Web 開発ツール
SublimeText3 Mac版
神レベルのコード編集ソフト（SublimeText3）
ホットトピック
7467
15
1376
52
77
11
19
20
Windows 11 で Xbox One コントローラーを適切に調整する方法
Sep 21, 2023 pm 09:09 PM
Windows がゲーム プラットフォームとして選ばれるようになったため、そのゲーム指向の機能を特定することがさらに重要になっています。その 1 つは、Windows 11 で Xbox One コントローラーを調整する機能です。組み込みの手動キャリブレーションを使用すると、ドリフト、ランダムな動き、またはパフォーマンスの問題を取り除き、X、Y、Z 軸を効果的に調整できます。利用可能なオプションが機能しない場合は、いつでもサードパーティの Xbox One コントローラー調整ツールを使用できます。確認してみましょう！ Windows 11 で Xbox コントローラーを調整するにはどうすればよいですか?続行する前に、コントローラーをコンピューターに接続し、Xbox One コントローラーのドライバーを更新していることを確認してください。この作業中に、利用可能なファームウェアのアップデートもインストールします。 1. 風を利用する
Terrariaでコマンドを使用してアイテムを取得するにはどうすればよいですか? -Terrariaでアイテムを集めるにはどうすればよいですか？
Mar 19, 2024 am 08:13 AM
Terrariaでコマンドを使用してアイテムを取得するにはどうすればよいですか? 1. Terraria でアイテムを与えるコマンドは何ですか? Terraria ゲームでは、アイテムにコマンドを与えることは非常に実用的な機能です。このコマンドにより、プレイヤーはモンスターと戦ったり、特定の場所にテレポートしたりすることなく、必要なアイテムを直接入手できます。これにより、時間が大幅に節約され、ゲームの効率が向上し、プレイヤーは世界の探索と構築により集中できるようになります。全体として、この機能によりゲーム体験がよりスムーズで楽しいものになります。 2. Terraria を使用してアイテム コマンドを与える方法 1. ゲームを開き、ゲーム インターフェイスに入ります。 2. キーボードの「Enter」キーを押してチャットウィンドウを開きます。 3. チャットウィンドウにコマンド形式「/give[プレイヤー名][アイテムID][アイテム数量]」を入力します。
VUE3 クイック スタート: Vue.js 命令を使用してタブを切り替える
Jun 15, 2023 pm 11:45 PM
この記事は、初心者が Vue.js3 をすぐに使い始めて、簡単なタブ切り替え効果を実現できるようにすることを目的としています。 Vue.js は、再利用可能なコンポーネントの構築、アプリケーションの状態の簡単な管理、ユーザー インターフェイスの操作の処理に使用できる人気の JavaScript フレームワークです。 Vue.js3 はフレームワークの最新バージョンであり、以前のバージョンと比較して大きな変更が加えられていますが、基本原理は変わっていません。この記事では、読者が Vue.js に慣れることを目的として、Vue.js の命令を使用してタブ切り替え効果を実装します。
Laravelをゼロから学ぶ：コントローラーメソッド呼び出しの詳細説明
Mar 10, 2024 pm 05:03 PM
Laravelをゼロから学ぶ：コントローラーメソッド呼び出しの詳細解説 Laravelの開発において、コントローラーは非常に重要な概念です。コントローラーはモデルとビューの間のブリッジとして機能し、ルートからのリクエストを処理し、対応するデータを表示のためにビューに返す責任を負います。コントローラー内のメソッドはルートから呼び出すことができます。この記事では、コントローラー内のメソッドの記述方法と呼び出し方法を詳しく紹介し、具体的なコード例を示します。まず、コントローラーを作成する必要があります。 Artisan コマンド ライン ツールを使用して、
PHPでCodeIgniter4フレームワークを使用するにはどうすればよいですか?
May 31, 2023 pm 02:51 PM
PHP は非常に人気のあるプログラミング言語であり、CodeIgniter4 は一般的に使用される PHP フレームワークです。 Web アプリケーションを開発する場合、フレームワークを使用すると、開発プロセスのスピードアップ、コードの品質の向上、メンテナンス コストの削減が可能になり、非常に役立ちます。この記事ではCodeIgniter4フレームワークの使い方を紹介します。 CodeIgniter4 フレームワークのインストール CodeIgniter4 フレームワークは、公式 Web サイト (https://codeigniter.com/) からダウンロードできます。下
Laravelコントローラーとは何ですか
Jan 14, 2023 am 11:16 AM
laravel では、コントローラー (Controller) は特定の機能を実装するために使用されるクラスであり、コントローラーは関連するリクエスト処理ロジックを別のクラスに結合できます。一部のメソッドは、特定の機能を実装するためにコントローラーに保存されます。コントローラーはルーティングを通じて呼び出され、コールバック関数は使用されなくなり、コントローラーは「app/Http/Controllers」ディレクトリに保存されます。
入門から習得まで、2022 年の最新 5 つの angularjs チュートリアル
Jun 15, 2017 pm 05:50 PM
Javascript は、コードの構成、コードのプログラミング パラダイム、およびオブジェクト指向理論の点で非常にユニークな言語です。しかし、JavaScript が 20 年間主流であったとはいえ、jQuery、Angularjs、さらには React などの人気のあるフレームワークを理解したい場合は、「Black Horse Cloud Classroom JavaScript Advanced Framework」を見てください。デザインビデオチュートリアル」。
Laravel スタディガイド: コントローラーメソッド呼び出しのベストプラクティス
Mar 11, 2024 am 08:27 AM
Laravel 学習ガイドでは、コントローラー メソッドの呼び出しは非常に重要なトピックです。コントローラーはルーティングとモデルの間のブリッジとして機能し、アプリケーションで重要な役割を果たします。この記事では、コントローラー メソッド呼び出しのベスト プラクティスを紹介し、読者の理解を助ける具体的なコード例を示します。まず、コントローラー メソッドの基本構造を理解しましょう。 Laravel では、コントローラー クラスは通常 app/Http/Controllers ディレクトリに保存され、各コントローラー クラスには複数のものが含まれます。
