SharePoint PnP Webcast – Building Angular SharePoint Framework Client Web Part

Download this episode

Download Video


In this PnP Web Cast we concentrated on covering how to use Angular in your SharePoint Framework client side web part. We go throught the steps on adding Angular on the SP Fx web part project and build a simple task tracking solution. Actual tasks are not saved to SharePoint in this sample, since we wanted to concentrate on showing the Angular integration part, without additional complexity. You can certainly extend your implementation to talk to SharePoint lists for task CRUD operations. We also cover how to use ngOfficeUIFabric to help on making your Angular based client side web part UI consistent with SharePoint. ngOfficeUIFabric is community driven initiative to have Angular 1.x directives for Office UI Fabric components.

Notice. When this webcast was released SharePoint Framework was in Developer Preview, which means that the client web parts should not yet use in production at SharePoint Online.

Presentation covers following topics:

  • Steps to include Angular to your solution
  • Steps to get started on the Angular development with SP Fx

Web cast demo shows following details

  • Walk-through of the sample todo web part
  • Steps on creating your SP Fx project for the Angular implementation
  • Adding Angular and ngOfficeUIFabric dependencies
  • Creating controller and data service for your Angular app
  • Using correct Office UI Fabric version in your app
  • How to change your property pane to be reactive or non-reactive
  • Broadcasting property pane updates from SP Fx to Angular app

Web cast presenters: Waldek MastykarzVesa Juvonen

Presentation used in this web cast is available from

Source code for used client side web part will be shared during upcoming days at

Additional resources

See following resources around the upcoming SharePoint Framework. 

Thanks for your interest on the PnP initiative.

If you have any feedback or comments related on this web cast, please use the Office 365 network (SharePoint Developer group) to provider your input. Thx for your interest advance.






Available formats for this video:

Actual format may change based on video formats available and browser capability.

    The Discussion

    Comments closed

    Comments have been closed since this content was published more than 30 days ago, but if you'd like to send us feedback you can Contact Us.