How to use the angular.element function in angular

it('should have CSS for size', () => {
        let personas: angular.IAugmentedJQuery[] = [
          angular.element(''),
          angular.element(''),
          angular.element(''),
          angular.element(''),
          angular.element('')
        ];

        let expectedClass: string[] = ['ms-Persona--tiny', 'ms-Persona--xs', 'ms-Persona--sm', 'ms-Persona--lg', 'ms-Persona--xl'];

        for (let i: number = 0; i < personas.length; i++) {
          _compile(personas[i])(scope);
        }
        scope.$digest();

        let persona: JQuery;
        // let innerDiv: JQuery;

        for (let i: number = 0; i < personas.length; i++) {
          persona = jQuery(personas[i]);
          // innerDiv = persona.find('div.ms-Persona');

self.table.W = columnOffset[columnOffset.length - 1];
            self.table.setup();

            // console.log('displaying cells', scrolledCellX, scrolledCellY);
            self.table.scroll.setScrollXY(x, y); //table.setup() scrolls to 0,0, here we scroll back to were we were while resizing column
        }

        const eventId = "resize.fattable." + settings.tableContainerId;
        angular.element($window).unbind(eventId);
        const debounced = _.debounce(self.setupTable, settings.setupRefreshDebounce);
        angular.element($window).on(eventId, function () {

            debounced(settings);
        });

        angular.element(selector).on('$destroy', function () {

            angular.element($window).unbind(eventId);
        });
    }

it('should transclude INPUT content', () => {
		let $element = test.buildTemplate('input', { class: 'my-content' });
		
		expect($element.length).toEqual(1);
		expect(angular.element($element[0]).hasClass('my-content')).toBe(true);
	});
});

var compile = function () {
  $rootScope.mockModel = 'cycle' + cycleIndex++;
  $rootScope.mockQueryInput = undefined;

  $elem = angular.element(markup);
  $compile($elem)($rootScope);
  $elemScope = $elem.isolateScope();
  $rootScope.$digest();
};

function createPopover(htmlString) {
      element = angular.element(htmlString);
      $compile(element)(scope);
      scope.$apply();
      return $('body').find('.popover:first');
    }

it('when cleared, $dirty should be set', inject(($rootScope: angular.IRootScopeService, $compile: Function) => {
    let $newScope: any = $rootScope.$new();
    $newScope.value = 'Value';

    let tag: JQuery = angular.element('');
    $compile(tag)($newScope);
    $newScope.$digest();
    tag = jQuery(tag[0]);

    let ngModel: angular.INgModelController = angular.element(tag).controller('ngModel');
    expect(ngModel.$dirty).toBe(false);

    let input: JQuery = tag.find('.ms-SearchBox-field');
    let button: JQuery = tag.find('.ms-SearchBox-closeButton');

    angular.element(button).triggerHandler('mousedown');
    angular.element(input).triggerHandler('blur');

    $newScope.$digest();

    expect($newScope.value).toBe('');
    expect(ngModel.$dirty).toBe(true);
  }));
});

public showProfileDialog(currentTab: any, profileRow: any) {

        this.$mdDialog.show({
            controller: 'FeedProfileItemController',
            templateUrl: 'js/feed-mgr/feeds/edit-feed/profile-history/profile-history-dialog.html',
            parent: angular.element(document.body),
            clickOutsideToClose: false,
            fullscreen: true,
            locals: {
                feed: this.model,
                profileRow: profileRow,
                currentTab: currentTab
            }
        }).then((msg: any) => {
        }, () => {
        });
    };
}

addDirective(element: any, name: string, scope: any) {
    const child = angular.element(document.createElement(name));
    this.$compile(child)(scope);

    element.empty();
    element.append(child);
  }

function createPopup(step, tour) {
        const scope = angular.extend($rootScope.$new(), {
                tourStep: step,
                tour: tour
            }),
            popup = $compile($templateCache.get('tour-step-popup.html'))(scope),
            parent = step.config('appendToBody') ? angular.element($document[0].body) : step.element.parent();

        parent.append(popup);
        return popup;
    }

beforeEach(function () {
      scope = $rootScope.$new();
      let formName = 'myTopLevelForm';
      let subFormName = 'mySubForm';

      wizardSubFormValidation.config({scope: scope, form: formName});

      let element = angular.element(
        `<form name="${formName}">
             
               <input required="" name="myInput">
             
           </form>`);

      $compile(element)(scope);

      form = scope.myTopLevelForm;
    });