Ember.js + JQuery-UI Tooltip - Tooltip does not reflect the model / controller changes -
context
I have a small amber app, which among many other things, And, when hovering an element of the page, their names appear as a list.
Everything, it works very well. The application drages data from one endpoint to every two minutes, because the backend does not allow data to be pushed
The content of the tooltip is calculated in the Controller, with a function that is in the original form According to the context, the string combines in different ways. So this When new data is pulled from the backend, except the tooltip content, everything is updated accordingly. (When browsing the DOM of a page, the What can be the reason for not refreshing the tooltip? Does not it re-calculate JQuery-UI? Replaced 'containers' were added to each 'content text' by the viewer and supervisor. < This is what I think seems happening: Your tooltip library By calling it at It is to add both of those things, I think, that is causing your problem; I think whatever you have to do is also & lt; Img & gt; The data attribute of is bound to the tooltip, when the view is ready and
didInsertElement is removed, the tooltip will have this
data-bindet value Is generated on the basis of (if necessary).
Question
data-bindette value is also updated.)
Some code
Refreshing code in the app's controller:
monitor. Application Controller = Ember.ArrayController.extend ({itemController: 'process', sortProperties: [' name '], sortAscending: true, intervalId: undefined, startRefreshing: function () {var self = this; if (self.get' intervalId ')) {Return;} Self .set (' IntervalID ', set interval (function () {self.store.fund (' process');}, 120000));}});
See: process HBS
& lt; Div {{bind-entry class = ": inline inactive: inactive"}}> & Lt; Img {{Tie-attr src = icon}} {{Tie-Entry Data-Caption = Content Text}} Class = "Caption" /> & Lt; Div class = "counter" & gt; {{NbUsers}} & lt; / Div & gt; & Lt; / Div & gt;
See: process view
monitor. Processview = amber View. Extension ({// (...) Different Goods. DidInsertElement: Function () {This.updateTooltip ();}, updateTooltip: function () {console.log ('InsatideTooltip!'); If (! This. $ ( }) {Return;} If (this.get ('Controller'). Get ('Inactive')) {{. Item: 'Caption', Disabled: true}); Return;} This is $ () Tooltip ({item: 'caption', tooltipClass: 'tooltip', content: function () {return $ (this) .data ('caption');}, position: {my: 'left + 15px center', at : 'Right center', collision: 'flip'}, show: false, hide: false}}}} .observes ('controller.inactive', 'controller.contentText')});
Controller: Process Controller
Monitor. Process Controller = Ember.ObjectController.extend ({contentText: function () {var tooltipContent = ''; this.get ('container') .for each (for work (container)) {// Tooltip tooltip : // container.get ('name') // container.get ('text') // container.get ('size') // container.get ('nbusers') // data-bindet value correctly Refresh, so I cut it for readability. Return Tooltip;). Property ('name', 'containers. @ Each')});
Edit 1:
data-caption attribute. Meaning, when you update the feature, you must clearly tell the library to update Tooltit. However, although your feature is just being updated right now, Tool Tip Library is not really looking for those updates.
updateTooltip , what you do can be done in
didInsertElement . However,
didInsertElement is only ignited once the element is inserted, when the element is first inserted. This is not said when the material changes.
updateTooltip also
controller. See the hint text property. Then it should be called when the text is updated.
Comments
Post a Comment