根據查詢參數ember更改div顏色

-1

我試圖通過{{#link-to}}幫助程序發送查詢參數，在我的路由中獲取查詢參數，然後根據發送的參數動態更改div的顏色。我可以看到我獲得了正確的ID，但似乎沒有任何信息在頁面上發生。根據查詢參數ember更改div顏色

這裏是我的鏈接幫手

<li>{{#link-to 'usernotification' (query-params highlightedNotification=activeUserNotification.id) 
          classNames="read-more"}}Read more{{/link-to}}</li>

，這裏是我的路線

export default BaseRoute.extend({ 
    accountService: Ember.inject.service('account'), 
    userNotificationService: Ember.inject.service('usernotification'), 

    queryParams: { 
     highlightedNotification: { 
      refreshModel:true 
     } 
    }, 

    beforeModel(params){ 
     this._super(...arguments); 
     Ember.$("#"+params.queryParams.highlightedNotification).attr('style', 'background-color: black !important'); 
    }, 

});

任何人都可以看到，我錯了？

來源

2017-03-23 Nick Pocock

在beforeModel掛鉤，路線尚未呈現！因此，您嘗試修改的DOM元素不在其位置。

您可以使其以某種方式工作。例如，通過將代碼打包爲Ember.run.scheduleOnce('afterRender', this,()=>{/*your code*/});來安排運行該代碼以在afterRender階段工作。還有其他的選擇。

但這不是灰燼的方式。您應該將這些數據傳遞給相應的組件。組件應決定如何顯示它。

此外，名稱「highlightedNotification」可能是錯誤的。它應該是這樣的：「selectedNotification」，「currentNotification」，「notificationToBeAttentioned」。讓組件決定如何強調注意力。「highligting」只是一種注意方式。

樣本twiddle來說明建議的方式。

來源

2017-03-23 19:26:11 ykaragol

根據查詢參數ember更改div顏色

回答

相關問題