Angular ui-grid without using scope

I started using Angular ui-grid in my application. I could found only documentation with $scope usage.

ui-grid version: 3.1.1

Link to ui-grid selection docs

Reason: one of the main reason why i want to avoid scope, our Angular 2 migration will be lot easy.

Created sample project in Plunker: Sample Project

1. In this ui-grid version both cell navigation and grid row selection will not work together
2. You can pass null value for scope parameter. you can refer to event registration in controller code.

gridApi.selection.on.rowSelectionChanged(null, _self.onSelectRow);
var GridController = (function () {
    function GridController() {
        this.gridOptions = this.getGridOptions(); = [{name: "test1", gender: "male", company: "com1"},
        {name: "test2", gender: "male", company: "com2"},
        {name: "test3", gender: "female", company: "com3"}]
    GridController.prototype.getGridOptions = function () {
        var _self = this;
        return {
            enableRowSelection: true,
            enableRowHeaderSelection: false,
            columnDefs: [
                { field: 'name' },
      { field: 'gender' },
      { field: 'company' }
            appScopeProvider: _self,
            multiSelect: false,
            modifierKeysToMultiSelect: false,
            noUnselect: true,
            enableFiltering: true,
            enableSorting: true,
            onRegisterApi: function (gridApi) {
                _self.gridApi = gridApi;
                gridApi.selection.on.rowSelectionChanged(null, _self.onSelectRow);
    GridController.prototype.onSelectRow = function (selectedRow) {
    return GridController;


Note: This has code for modules and directives. Directive uses controller as syntax

// Code goes here
(function() {
  var appControllers = angular.module("app.Controllers", []);
  appControllers.controller("GridController", GridController);

  var appDirectives = angular.module("app.Directives", ["ui.grid", "ui.grid.selection", 'ui.grid.cellNav', 'ui.grid.pinning']);

  appDirectives.directive("demoGrid", function() {
    return ({
      restrict: 'E',
      templateUrl: "grid.html",
      controller: "GridController as gc",

  var app = angular.module("app", ["app.Controllers", "app.Directives"]);


Happy Coding!

Parameters creation for grouped elements in Revit

This is one problem took more time to solve.

Requirement: Addin should create parameters on launch.
Problem: We didn’t face any issues unless there are doors inside groups in the Revit model.

Step 1: Creating parameter is straight forward implementation from Revit API.

var doc = UIApp.ActiveUIDocument.Document;

/*create a temporary file to store parameters then apply to model*/

string originalFile = UIApp.Application.SharedParametersFilename;
string tempFile = Path.GetTempFileName() + “.txt”;
using (File.Create(tempFile)) { }
UIApp.Application.SharedParametersFilename = tempFile;
ExternalDefinitionCreationOptions edCO = new ExternalDefinitionCreationOptions(parameterName, parameterType);
edCO.Visible = isVisible;
var definition = UIApp.Application.OpenSharedParameterFile().Groups.Create(groupName).Definitions.Create(edCO);

/*revert file back to original file*/

UIApp.Application.SharedParametersFilename = originalFile;

var newCategory = doc.Settings.Categories.get_Item(builtInCategory);
var newCategorySet = UIApp.Application.Create.NewCategorySet();
Autodesk.Revit.DB.Binding binding = UIApp.Application.Create.NewInstanceBinding(newCategorySet);

doc.ParameterBindings.Insert(definition, binding, paramGroup);

Now Step 2, mark that parameter with vary by group instance flag

var doc = UIApplication.ActiveUIDocument.Document;

/*Here element could be door and the parameterName that you just created or want to change*/
var opdef = element.LookupParameter(parameterName).Definition as InternalDefinition;
if (opdef != null && !opdef.VariesAcrossGroups)
opdef.SetAllowVaryBetweenGroups(doc, true);

Now Step 3: Here is the final change need to be done.
we tried to create different parameters with different data types like integer and text.

Note: Revit allowed us to create only parameters with type Text. It didn’t allow any other data types.

So in Step 1, Always set the parameterType to ParameterType.Text.

AngularJS setup with TypeScript

Recently I started building web applications with Angular and TypeScript. I thought it will good one to create a seed project to myself.

This project is created using
MVC 6, TypeScript and AngularJS 1.5
npm managing packages and running tasks

gulp: for running tasks
Reason:Tasks are written in JavaScript, so it’s much more easy to debug incase of errors.

typings: Since tsd is deprecated, I have used to install typescript definition files. Most of the editors are capable of providing IntelliSense based on these definition files.

browserify: This helps bundle packaging modules written in CommonJS.
Reason: This is much more closer to server side development like NodeJS.

template cache: This creates angular module with all the html templates in project.

sass: compiles all scss files to css
Reason: I chose scss because syntax is much closer to css.

normalize.css: This resets default styling in all major browsers. this helps us getting consisting look across all browsers.

Project can be downloaded from: download from github

Run the following commands from root folder where are config files are present (WebApp folder).

npm install typescript gulp -g

npm install

typings install

Happy Coding!