Visual Studio Cordova에서 Angular ng src가 작동하지 않습니다

이전 Cordova CLI 버전에서 작동했던 Cordova Visual Studio에서 ng-src 문제가 있습니다 (다시 5 등으로 시도했지만 작동하지 않았습니다).Visual Studio Cordova에서 Angular ng src가 작동하지 않습니다

<img src="example.jpg" />

및 각도 이미지 :

나는 또한 기본의 이미지가 옆에

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

면을 기본 작동하지만 각 버전입니다.

또한 $ sceDelegateProvider 수정을 시도했지만 그 중 하나도 작동하지 않았습니다.

내 index.html 코드와 스크린 샷 2 장이 첨부되어 있습니다 (하나는 작동 중입니다).

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

어떤 코덱 플랫폼입니까? 콘솔에 오류가 있습니까? 코드 포트에 console plugin https://github.com/apache/cordova-plugin-console을 설치하여이 오류를 확인하십시오. –

업데이트 : Windows/local에서는 이미지가 나타나지 않습니다. 그러나 ios와 Android에서 그들은 그렇게합니다. Windows 장치의 스타일을 덮어 쓰는 것이 있습니까? – AivoK

Windows와 Angular를 많이 사용하지는 않았지만 "Windows Store App"을 구축하는 경우 MSApp.execUnsafeLocalFunction 및 "안전하지 않은"것으로 간주되는 특정 기능을 사용하여 일부 행사를해야한다는 것을 알고 있습니다 (http : //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 플랫폼에서는 안전을 이유로 일부 접두사가 자동으로 추가됩니다. "URL 접두어 수정"섹션 this blog을 참조하십시오. img가 올바르게로드되지 않습니다.

이 문제가하는 index.js 파일에 다음 코드를 추가 해결하려면 :

//"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\//); 
}]);

참고 : 블로그에서 다른 내가 문자열 패턴에 "MS-appx-웹"을 추가했다.

출처

2016-06-02 07:09:47

와우. 그게 효과가 있었어. 블로그 페이지도 가져 주셔서 감사합니다. – AivoK

는 각도는 NG-SRC의 식을 계산, 그래서 아마 URL로 취급을하기보다는라는 변수 example.jpg를 찾고 있습니다. 당신이 사용하는 경우

, 그것을 작동합니다 :

<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가 작동하지 않습니다

답변

관련 문제