I am using mxgraph along with angular. When mxgraph loads I creates sidebar and toolbar, etc. dynamically which are not in angular scope. My question is how can I put these in angular scope so that I can use the features provided by angular?
Related
I have used FullCalendar inside my angular application. I have created a reusable component using the FullCalendar and use it like this,
<app-full-calendar
[building]="selectedBuilding"
[newEvent]="newEvent"
(clickedEvent)="clickedEvent($event)"
(clickedDate)="dateClicked($event)"
[updatedEvent]="updatedEvent"
[deleteEvent]="deletedId"
></app-full-calendar>
when ever necessary.
The issue is there are custom styling necessities such as changing the cursor of events. In order to achieve this, I have to add custom styles inside the component. But so far I was not able to find any solution.
I'm looking for a way to create a reusable HTML widget for a website run on Sitecore 8. My original idea was to create a data template that basically consisted of a single Rich Textbox. The idea is that you could drop any number of instances of these widgets on a placeholder and it would render out the HTML from each instance of the widget on the page and in the correct placeholder.
Example:
A content item called /products/my-product is based off of "Product" data template
It consists of some fields on the Product template (maybe product name, price)
I'd like the ability for the content editor to quickly drop one or more instances of the HTML widget on the page (say, in the right rail or in a different placeholder on the sublayout. I know I could just throw a "notes" field on the product template, but I'd like to make it more dynamic so that they can add several instances of this HTML widget and place them anywhere they desire.
I quickly realized that because we need the ability for multiple instances of this widget, a data template was not enough because each instance of the widget would needs its own data to populate on the front. Thus, my idea was to allow the content editor to add HTML widgets as a child of the current item (so each item would have its own instance data). I don't think this will work because I don't know of a way to have these children tell the parent page which placeholder to put them in, so laying them out is a problem.
I also thought about somehow setting the placeholder name as a parameter or field on the data template for the HTML widget, but I couldn't figure out how to get Sitecore to dynamically add them to a placeholder when it glues everything together.
Is there a way to achieve what I'm trying to do? Seems like a reusable HTML (or other kind of widget, for that matter) would be a fairly common need. I feel like there's an easy Sitecore way to handle this that I'm missing and overcomplicating the solution.
From what I understand, you're looking for Datasource field of a component.
Basically you:
Create a data template which contains fields necessary for your component
Create a set of items using that templates
Allow authors to select one of them as the Datasource for your component.
It's built in Sitecore functionality.
Check blog post http://firebreaksice.com/using-the-datasource-field-with-sitecore-sublayouts/ or google for Sitecore datasource.
Other links:
http://www.nonlinearcreations.com/Digital/how-we-think/articles/2014/03/4-patterns-Sitecore-component-development.aspx
http://www.nonlinearcreations.com/Digital/how-we-think/articles/2015/04/Sitecore-templates.aspx
EDIT:
Read about Datasource Location field (defining the repository of datasources location) here: http://www.sitecore.net/learn/blogs/technical-blogs/getting-to-know-sitecore/posts/2011/01/handling-presentation-component-settings.aspx
Read about Datasources and MVC here: http://jockstothecore.com/sitecore-mvc-item-maze/
I am developing rails application where angularjs use in it.
I am facing one problem which i can't understand. Angularjs works fine in all events but i have one module where new html load after page scroll and one another where push new html into existing html on page.
On new html inserted in page, one button in new html where i would like to ng-click event bind with it so when user click on that button i want to procedure.
I tried it but not getting how to bind with button because on loaded html bind easily but in new html not bind.
How to bind on that new HTML button?
Any one have a idea?
Thanks
You need to compile the html in order to get the binds.
Inject $compile in your controller and:
var cHtml = $compile("<button ng-click='doSomething()'>Click me!</button>")($scope);
Then you can add that html using element.append() or jquery
I have an Angular model ng-model="car" I am trying to create a dropdown list, and would like the list items to be populated from objects in the model. I am trying to do this all in the HTML (since it is Angular).
Any thoughts?
If you want a form input: http://angular-ui.github.com/#/directives-select2
If you want a dropmenu: http://angular-ui.github.com/bootstrap/#/dropdownToggle
Checkout the dropmenu source code too to get an idea of how to go about doing it if you rather code up your own solution.
Essentially AngularJS makes it so easy that the ONLY thing you really need to do is toggle the visibility of a DOM element and use some fancy css.
Checkout this example of using pure AngularJS + AngularUI (when necessary) alongside Bootstrap's CSS to create dropmenus (and other widgets) http://plnkr.co/edit/gist:4464334?p=preview
QQ: How can I update an object's property to match the innerHtml of an element in a view when a button is clicked?
I am working on building a content editing interface using EmberJS and the HTML5 contenteditable attribute (via the Hallo editor). This means that valueBinding doesn't do the trick, since we're dealing with the actual page HTML, not input/textarea value attributes. I've built a similar app in Backbone, which lacks dynamic bindings but allows you to set the model object as a property of the view.
What's the best way to get this working with EmberJS? Should I set a property on the view to the entire model? Do I need to create some sort of innerHtml binding and view helper, modeled on valueBinding?
I've set up a fiddle with an example of what I'm trying to do (with basic jQuery handling of the contentEditable attribute, instead of hallo):
http://jsfiddle.net/W6gsW/2/
Thanks!
http://jsfiddle.net/ud3323/nXCvq/
I did change a few things with how you defined the bindings in App.docView to make things cleaner. My solution does feel a litte hackish, but it works with 1 line of code per property.