AngularJS - 主画像の変更時に別の画像を変更する方法

-2

AngularJSを使用してソリューションを開発しようとしています。ユーザーがプロファイル画像を変更すると、そのプロファイルに基づく他のすべての写真も変更されます。AngularJS - 主画像の変更時に別の画像を変更する方法

は、どのように私は、この機能の開発を始めることができますか？

ありがとうございます！

[ソリューション]

の@ wolfman6377の助けを借りて、私は機能を理解し、私は必要なもののためのソリューションを開発することができます。私はCodePenに例を残します。

var myApp = angular.module('myApp',[]); 

myApp.controller('myController', function() { 
     this.myVar = 'https://robohash.org/asd' 
     this.updatePicture = function() { 
      this.myVar = 'https://angular.io/resources/images/logos/angular/angular.png'; 
     }; 
});

wolfman6377 @、ありがとうございます。

出典

2017-04-20 IgoR

それはあなたの問題はここにあるものは全く明らかではありません。あなたのコードは混乱しています。角型のアプリケーションやコントローラがなく、 'ng-init'を目的に使用しようとせず、jqueryを使用してクリック時の' ng-init'値を変更しようとしていますが、 'ng-ページがロードされるときにのみ、「init」値が1回処理されます。あなたは角度の設計方法を学ぶためにもう少し時間を費やし、絶対に他のオプション**がない限り角ページにjqueryをロードしないでください。 – Claies

@Claies "wolfman6377"の反応を見る...彼は助けたい、そうではない。 – IgoR

あなたはjQueryのような戦略を使用しています。 jQuery要素セレクタはmyVarの値を変更できません。

angular1の基本的なチュートリアルをお勧めします。しかし、一言で言えば、以下を行う必要があります。

は、要素をつかむしないと変更が
追加にNGクリック
テンプレートにng-app値
使用NG-コントローラにモジュールを追加する属性myVar

テンプレート

<body ng-app="myApp"> 
    <div id="var" ng-controller="myController as vm"> 
     <img ng-src={{vm.myVar}} /> 
     <button ng-click="vm.updatePicture()">Click me</button> 
    </div> 
</body>

の値を更新するためのボタン

コントローラ：

angular 
    .module('myApp', []) 
    .controller('myController', function() { 
     this.myVar = 'https://www.w3schools.com/angular/pic_angular.jpg' 
     this.updatePicture = function() { 
      this.myVar = 'https://angular.io/resources/images/logos/angular/angular.png'; 
     }; 
    });

出典

2017-04-20 13:55:32 user2954463

ありがとう、これは今作動します！ :) – IgoR

AngularJS - 主画像の変更時に別の画像を変更する方法

答えて

関連する問題