我正在 ionic/angular 中構建一個值選擇器組件,但是我對傳遞給組件的訊息/標題有一個問題。我希望能夠指定當前選擇的值在訊息中的顯示位置。
我考慮在訊息字串中傳遞一些標記,如 %value% 以由組件處理。但是,必須有更標準的方法來處理這個問題嗎?
在下面的快照中,我希望<ion-badge> {{Value}} </ion-badge>顯示 X 所在的位置。
<div class="ValueSelector_Container">
<div class="Message">
<ion-label>{{Message}} <ion-badge> {{Value}} </ion-badge> </ion-label>
</div>
...

這是我呼叫/托管當前組件的方式。我最終會處理實際選定值的輸出
<ValueSelectorComp Message="Play X minutes before switching to bla bla" ></ValueSelectorComp>
我在這里通過 stackblitz 添加了代碼復制

如果您有有效的修復/建議,請分叉并報告鏈接。謝謝你。
https://stackblitz.com/edit/ionic-fx1ktl?file=pages/home/home.ts
Ionic:
Ionic CLI : 6.13.1 (C:\Users\AXM\AppData\Roaming\npm\node_modules\@ionic\cli)
Ionic Framework : ionic-angular 3.9.2
@ionic/app-scripts : 3.2.4
Cordova:
Cordova CLI : 9.0.0 (cordova-lib@9.0.1)
Cordova Platforms : android 7.0.0, browser 5.0.3
Cordova Plugins : cordova-plugin-ionic-webview 1.1.1, (and 13 other plugins)
Utility:
cordova-res : 0.15.3
native-run : not installed
System:
NodeJS : v10.16.0 (C:\Program Files\nodejs\node.exe)
npm : 6.9.0
OS : Windows 10
npm show ionic version
5.4.16
npm show cordova version
11.0.0
npm show angular version
1.8.2
show @angular/core version
13.1.1
uj5u.com熱心網友回復:
您可以使用內容投影來傳遞資料
<div class="ValueSelector_Container">
<div >
<ng-content> <ng-content>
</div>
并在父組件中
<ValueSelectorComp >
<ion-label>Play <ion-badge> {{Value}} </ion-badge> minutes before
switching to bla bla </ion-label>
</ValueSelectorComp>
uj5u.com熱心網友回復:
這個對我有用
<div class="ValueSelector_Container">
<div class="Message">
<ion-label>{{'Message'| translate: {X: Value}}}</ion-label>
</div>
</div>
<ValueSelectorComp Message="Play {{X}} minutes before switching to bla bla" ></ValueSelectorComp>
轉載請註明出處,本文鏈接:https://www.uj5u.com/gongcheng/407273.html
標籤:
