Visual Studio CordovaでAngular ng srcが動作しません

Cordova Visual Studioで以前のCordova CLIバージョン（5などに戻ってみましたが機能しませんでした）でng-src問題が発生しました。Visual Studio CordovaでAngular ng srcが動作しません

私もそのデフォルトにイメージを持っている：

<img src="example.jpg" />

と角度の画像：

<img ng-src="example.jpg" />

並んで、デフォルトでは、角度のバージョンを働いていないが。

私も$ sceDelegateProvider修正を試しましたが、それはどちらかといえども失敗しました。

私はindex.htmlコードと2つの画像のスクリーンショットを添付しています（1つは動作しています）。

  <!DOCTYPE html> 
       <html> 
        <head> 
         <meta http-equiv="Content-Security-Policy" content="default-src 'self' data: gap: https://ssl.gstatic.com 'unsafe-eval'; style-src 'self' 'unsafe-inline'; media-src *"> 

        <meta name="format-detection" content="telephone=no"> 
        <meta name="msapplication-tap-highlight" content="no"> 
        <meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width"> 
        <link rel="stylesheet" type="text/css" href="css/index.css"> 
        <title>TEST</title> 
       </head> 
       <body ng-app=""> 
       <h2>Device is Ready</h2> 

       <div ng-init="myVar = 'pic_angular.jpg'"> 
        <h1>Angular ng-src</h1> 
        <img ng-src="{{myVar}}" alt="this is where image should display"> 
        <h1>img src</h1> 
        <img src="pic_angular.jpg" /> 
       </div> 

       <div ng-app=""> 
        <p>My expression: {{ 5 + 5 }}</p> 
       </div> 

       <script type="text/javascript" src="cordova.js"></script> 
       <script type="text/javascript" src="scripts/platformOverrides.js"></script> 

       <script type="text/javascript" src="scripts/index.js"></script> 
       <script type="text/javascript" src="scripts/angular.min.js"></script> 
       </body> 
       </html>

なぜng-srcが機能しないのですか？コードヴァーバーバージョンの問題ですか？ Visual Studioの問題？コーディングの問題？

出典

2016-06-01 AivoK

どのコードバスプラットフォームですか？コンソールに何かエラーがありますか？ –

アップデート：Windows/localでは、画像が表示されません。これらのエラーを表示するには、コンソールプラグインhttps://github.com/apache/cordova-plugin-consoleをcordovaにインストールしてください。しかし、イオスやアンドロイドではそうしています。 Windowsデバイスのスタイルを上書きするものはありますか？ – AivoK

私はWindowsやAngularをあまり使っていませんが、 "Windows Store App"を構築する場合、MSApp.execUnsafeLocalFunctionと "安全でない"と見なされる特定の式を行う必要があることを知っています：//stackoverflow.com/questions/12792383/how-do-you-get-angular-js-to-work-in-a-windows-8-store-app）。また、参照してください：http://stackoverflow.com/questions/32454292/cordova-windows-8-1-on-visual-studio-2015-external-image-loading-to-img-tag?rq=1 –

角度を使ってimg-srcを設定するWindowsプラットフォームでは、安全上の理由から自動的にいくつかの接頭辞が追加されます。 this blogの「URLプレフィックスの修正」を参照してください。imgが正しく読み込まれません。

//"myApp" is the your module 
myApp.config(['$compileProvider', function ($compileProvider) { 
    $compileProvider.imgSrcSanitizationWhitelist(/^\s*(https?|ftp|file|ms-appx|ms-appx-web|x-wmapp0):|data:image\//); 
}]);

注：お使いのindex.jsファイルに次のコードを追加し、この問題を解決するには

ブログは異なるが、私は、文字列パターンに「MS-APPX-ウェブ」を追加、と述べました。

出典

2016-06-02 07:09:47

うわー。それはうまくいった。ブログのページもありがとうございます。 – AivoK

角度はNG-srcの中での発現を評価し、それはおそらくexample.jpgではなくURLとして扱い、それをという名前の変数を探しています。

これを使用する場合、それが動作するはずです：

<img ng-src="imgUrl">

そして、あなたのコードでは、imgUrl変数に実際のURLを割り当てます。

出典

2016-06-01 16:51:47 K48

私は割り当てていますng-src = "{{myVar}}"を角度imgに追加します。これはiosとAndroid Rippleシミュレータで表示されますが、Windowsエミュレータでは表示されません。 – AivoK

Visual Studio CordovaでAngular ng srcが動作しません

答えて

関連する問題