2016-04-04 47 views
0

スクリプトタグ内に変数を含む式をAngularに認識させる方法はありますか?私がコントロールできない理由から、これは私が物事をどのように動かさなければならないかのようなものです。ただ、基本的なアプリの起動スクリプトタグ内の角度テンプレート

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

<div ng-app="testApp"> 
    <input type="text" ng-model="testvar" /> 
    <input type="button" onclick="clickFn()" value="Test" /> 
    <script type="text/javascript"> 
    window.clickFn = function() { 
     console.log('{{testvar}}'); 
    } 
    </script> 
</div> 

基本的には私も呼び出すスクリプトタグものの、アプリにバインドされていない基本的な関数内の角度変数を利用できるようにしたいです機能は、アプリ内に収容されています。私はこれがベストプラクティスではないことを知っていますが、私の問題のための唯一の解決策だと思います。その他のソリューションも歓迎します。ありがとう!

Fiddle for playing

+0

はここに戻ってあなたのフィドルです。誰が 'window.clickFn'を呼びますか?あなたは、あなたが悪いパターンであることを知っているものをし、詳細な説明をしないように私たちに求めることはできません。コントローラコンストラクタ –

+0

@juanから 'window.clickFn = e => console.log($ scope.testvar)'を実行するだけで、ボタンクリック時に関数が呼び出されます。私の制限は、複数レベルのコンテンツの授権性から来ています。あるセクションでは、著者は{{testvar}}のようなテンプレート変数を置くことができ、別の場所にはtestvarの値を入力することができます。これらはJavaでページにレンダリングされます。これがインラインスクリプトタグの理由です。 – Chad

+0

私にそれを説明しないでください。私が提案した情報を追加して質問を改善してください。また、私が作った提案を試しましたか? –

答えて

0

我々は地獄に行っている場合は、なぜスタイルでそれをしませんか?変数DOMにして、臆面もなく、ターゲットブラウザによってtextContentまたはinnerHTMLで読むこと

<div ng-app="testApp"> 
    <input type="text" ng-model="testvar" /> 
    <input type="button" onclick="clickFn()" value="Test" /> 
    <p id="testvar" style="display:none"> 
    {{testvar}} 
    </p> 
    <script type="text/javascript"> 
    window.clickFn = function() { 
     console.log(document.getElementById("testvar").innerHTML); 
    } 
    </script> 
</div> 

バインド。あなたはこの制限を持っている理由それは言及する価値があると思いhttps://jsfiddle.net/8kpfu42w/2/

+1

私の最近の演出を不思議に思わせる... https://jsfiddle.net/1m5uyrof/ – Chad

関連する問題