根據轉換字符串加載指令

所以我想根據來自角度轉換的翻譯在HTML頁面中插入指令。可以說我有這兩個指令：根據轉換字符串加載指令

.directive('englishText', function() { 
    return { 
    template: 'Hello' 
    }; 
}); 
.directive('spanishText', function() { 
    return { 
    template: 'Hola' 
    }; 
});

而且我有這兩個JSON文件從將翻譯過來：

english.json 
{ 
"LANGUAGE" : "english-text" 
}

spanish.json 
{ 
"LANGUAGE" : "spanish-text" 
}

所以html頁面我要上有這樣的事情：

<div {{'LANGUAGE' | translate}}></div>

但作爲輸出我僅僅指剛得到這個：

<div {{'language' | translate}}></div>

代替

<div english-text>Hello</div>

我也試過這樣：

<{{'LANGUAGE' | translate></{{'LANGUAGE' | translate}}>

，但我得到這個作爲一個輸出

<english-text>

這是inter如同innerHTML一樣被預裝，而不是像標籤...

來源

2016-01-26 Vasil Emilov

爲什麼要這麼做，這看起來像是超級糟糕的做法。除此之外，你不能在你的模板中做到這一點，你需要在父指令中做到這一點，其中'$ compile（）'是子目錄 –

你應該有1個指令可以處理所有的翻譯，而不是每個指令的不同指令翻譯。英語指令與西班牙指令有什麼不同，當然除了語言？ – Rhumborl

@Rhumborl它只是模板沒有什麼不同......我只是簡化了問題，所以只有主要點應該在那裏... –

如果你堅持這樣做，你所要求的方法就是這樣做，父指令將$compile一個基於語言的指令，並替換內部html到新指令

.directive('languageDirective', function($compile) { 
    return { 
     restrict: 'EA', 
     link: linkFn, 
     scope: { 
      language: '@' 
     } 
    }; 

    function linkFn(scope, element, attrs) { 
     element.html(
      $compile(getTemplate)($scope) 
     ); 
    } 

    function getTemplate() { 
     if(scope.language === 'english') 
      return '<div english-directive></div>' 
     else 
      return '<div other-directive></div>' 
    } 
});

來源

2016-01-26 08:46:48

我不明白如何實際使用這個，你能給我一些信息來源哪些我可以更多地瞭解您的解決方案，或者您是否可以更詳細地解釋它？ –

在您的模板中，您可以執行類似'

'的操作，然後將加載英語指令並將其放入其內容中。有關'$ compile'的更多信息，請訪問https://docs.angularjs.org/api/ng/service/$compile –

嗯，我必須將$ compile和$ scope放入指令中，但即使在此之後出現錯誤'錯誤：[$ injector：unpr] http：//errors.angularjs.org/1.4.9/$injector/unpr？p0 =％24scopeProvider％20％3C-％20％24scope％20％3C-％20languageDirectiveDirective' –

根據轉換字符串加載指令

回答

相關問題