SharePoint PnP Webcast – Building Angular SharePoint Framework Client Web Part

Play SharePoint PnP Webcast – Building Angular SharePoint Framework Client Web Part
Sign in to queue


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.






Download this episode

The Discussion

Add Your 2 Cents