Scribd
Upload
165 views

SharePoint and AngularJS

This document provides information about an upcoming SharePoint and AngularJS event in Phoenix, Arizona. It includes details about the event location and speakers, as well as an overview of the topics to be covered which include introductions to AngularJS, building AngularJS applications, and integrating AngularJS with SharePoint. Contact and profile information is also provided for the main speaker, Lester Sconyers, along with information about local user groups and opportunities to network with other attendees after the event.

Uploaded by

shivani.cs1995
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PPTX, PDF, TXT or read online on Scribd
165 views

SharePoint and AngularJS

This document provides information about an upcoming SharePoint and AngularJS event in Phoenix, Arizona. It includes details about the event location and speakers, as well as an overview of the topics to be covered which include introductions to AngularJS, building AngularJS applications, and integrating AngularJS with SharePoint. Contact and profile information is also provided for the main speaker, Lester Sconyers, along with information about local user groups and opportunities to network with other attendees after the event.

Uploaded by

shivani.cs1995
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PPTX, PDF, TXT or read online on Scribd
You are on page 1/ 17

SPS EVENTS PHX

SharePoint and
Angular Sitting in
a Tree
LESTER SCONYERS

@lestersconyers #spsevents

Thank you sponsors


Gold

Silver

Bronze

@lestersconyers #spsevents

SharePint
Come socialize with the speakers and
attendees
Meet us at Thirsty Lion @ Tempe
Marketplace immediately after
SPSPHX
Reservations under SharePoint
Saturday

@lestersconyers #spsevents

AZ SharePoint Pros User Group

Meets monthly on the 1st


Wednesday

6:00pm 8:00 pm

Located at Interface Technical


training (Central Ave. just north
of Thomas)

Great SharePoint topics and free


pizza

Stop by the booth and join our


mailing list for up to date info

http://www.azsharepointpros.com

@lestersconyers #spsevents

About Me
Lester Sconyers

Senior Consultant with Neudesic

Local to Phoenix

7+ years as a SharePoint
Developer

Vice President of AZ SharePoint


Pros User Group

http://www.lestersconyers.com

@lestersconyers

[email protected]

@lestersconyers #spsevents

What well cover today

Introduction to AngularJS

AngularJS Basics

Getting Started with AngularJS in SharePoint

Building an AngularJS app

Lets go off-road!

@lestersconyers #spsevents

What is AngularJS

AngularJS is a structural framework for dynamic web apps. It


lets you use HTML as your template language and lets you
extend HTML's syntax to express your application's
components clearly and succinctly. Angular's data binding
and dependency injection eliminate much of the code you
would otherwise have to write. And it all happens within the
browser, making it an ideal partner with any server
technology.
HTTPS://DOCS.ANGULARJS.ORG/GUIDE/INTRODUCTION

@lestersconyers #spsevents

AngularJS Basics
MVC

Model: Your data

View: What the user sees (HTML UI)

Controller: Your business logic

@lestersconyers #spsevents

AngularJS Basics
Templating

Leverages HTML to build a


dynamic View for Model

Data Binding

Keeps user entered data


synchronized with Model (2-way
binding)

@lestersconyers #spsevents

AngularJS Basics
Demo

@lestersconyers #spsevents

AngularJS Basics
Scope

Scope is the glue between


application controller and the
view

Directives

DOM attributes that contain


instructions for the Angular
compiler

ngBind: Insert this model


property in this element

ngModel: Insert and monitor this


model property for this input

ngRepeat: Render this HTML


block for each item in an Array

$scope is the Model

@lestersconyers #spsevents

How to get started in SharePoint


1.

Reference JavaScript files

2.

Add data-ng-app to a root element (consider adding to the


SharePoint:SPHtmlTag for IE9 support!)

3.

Create view (if pasting into a rich text editor, use data-ng-*
instead of ng-*)

4.

Create controller

5.

Get model data

@lestersconyers #spsevents

How to get started in SharePoint


Deploying your code

SharePoint App

Webpart

Application page

Content Editor web part**

Rich text editor

@lestersconyers #spsevents

Building an AngularJS app


Demo

@lestersconyers #spsevents

What we covered today

AngularJS is a JavaScript framework that allows you to rapidly


build applications using an MVC design pattern

An AngularJS template is a block of HTML

AngularJS provides 2 way binding which synchronizes data


between the model and view

$scope is your Model (kinda)

Directives are instructions for the behavior of AngularJSs


compiler

AngularJS can be leveraged in SharePointjust like any other


web application

@lestersconyers #spsevents

Questions?

@lestersconyers #spsevents

Lets go off-road!

@lestersconyers #spsevents

You might also like