如何向ionic 3 typescript项目添加外部javascript库_Javascript_Xml_Angular_Typescript_Ionic Framework

如何向ionic 3 typescript项目添加外部javascript库

javascript xml angular typescript ionic-framework

如何向ionic 3 typescript项目添加外部javascript库,javascript,xml,angular,typescript,ionic-framework,Javascript,Xml,Angular,Typescript,Ionic Framework,对于作业，我们需要制作一个恒温器应用程序。我想在爱奥尼亚做到这一点，但我现在正在努力使用提供的API。我们已经获得了一个API.js文件，其中包含一组函数，用于与我们必须从中获取数据的服务器进行通信。我试图通过一个提供者自己实现这些函数，但由于服务器返回xml数据，到目前为止我还没有成功。所以我想通过将给定的API.js包含在我的项目中来使用它，但现在我也很难做到这一点。因此，我想了解一下如何将这个外部API包含到我的ionic项目中并使用它所拥有的函数，或者如何使用返回的xml数据（在应用程序

对于作业，我们需要制作一个恒温器应用程序。我想在爱奥尼亚做到这一点，但我现在正在努力使用提供的API。我们已经获得了一个API.js文件，其中包含一组函数，用于与我们必须从中获取数据的服务器进行通信。我试图通过一个提供者自己实现这些函数，但由于服务器返回xml数据，到目前为止我还没有成功。所以我想通过将给定的API.js包含在我的项目中来使用它，但现在我也很难做到这一点。因此，我想了解一下如何将这个外部API包含到我的ionic项目中并使用它所拥有的函数，或者如何使用返回的xml数据（在应用程序中显示并将修改后的数据发送回来）

由于这两个文件都相当大，我在下面提供了一些代码片段和pastebin链接中的完整文件

我们可以使用的get和put命令有day、time、currentTemperature、targetTemperature、daytimerature、nightTemperature、weekProgramState和weekProgram

提前多谢

var ServerUrl=''；
类型={
Day:“Day”，
夜：“夜”
};
天数={
星期一：“星期一”，
星期二：“星期二”，
星期三：“星期三”，
星期四：“星期四”，
星期五：“星期五”，
星期六：“星期六”，
星期日：“星期日”
};
var MintTemperature=parseFloat（5.0）；
var MaxTemperature=parseFloat（30.0）；
var最大开关=5；
var时间；
var当前日期；
日温度；
夜间温度；
无功电流温度；
var目标温度；
var编程状态；
var程序={}；
计划[天.星期一]=[]；
计划[天.星期二]=[]；
计划[天.星期三]=[]；
计划[天.星期四]=[]；
计划[天.星期五]=[]；
计划[天.星期六]=[]；
计划[天.星期日]=[]；
/*检索日计划
*/
功能获取程序（天）{
返回程序[天]；
}
/*对加热时段（打开加热时的时段）进行排序并合并重叠的时段
*/
功能排序程序（天）{
var程序=获取程序（天）；
sort（函数（a，b）{return parseTime（a[0]）-parseTime（b[0]）}）；
对于（变量i=0；i=parseTime（程序[i+1][0]））{
var start=（程序[i][0]）；
var end=（parseTime（program[i][1]）>parseTime（program[i+1][1]）？program[i][1]：program[i+1][1]；
程序拼接（i，2）；
program.push（[开始，结束]）；
分拣计划（天）；
打破
}
}
}
/*从服务器检索除weekProgram之外的所有数据
*/
函数get（属性名称、xml标记）{
返回请求数据(
“/”+属性名称，
功能（数据）{
返回$（数据）.find（xml_标记）.text（）；
}
);
}
/*检索周计划
*/
函数getWeekProgram（）{
返回请求数据(
“/weekProgram”，
功能（数据）{
$（数据）。查找（'day'）。每个（函数（）{
var day=$（this.attr（'name'）；
节目[日]=[]；
$（this）.find（'switch'）.each（function（）{
if（$（this.attr（'state'）=='on'）{
if（$（this.attr（'type'）==type.Day）{
getProgram（day）.push（[$（this.text（），'00:00']）；
}否则{
getProgram（day）[getProgram（day）.length-1][1]=$（this.text（）；
}
}
})
});
返回程序；
}
);
}

我要做的是创建一个名为

API.ts的文件。在它里面，我将创建一个API类，其中包含API.js
的属性和函数，并更正Typesctipt语法
看起来写这个文件的人也想使用jquery
，但它没有导入，所以我也导入了它。我想您已经收到了这个文件，所以请确保将它放在src/assets
中，并更正我的代码中的导入路径，以获得匹配的文件名
以下是我为您准备的：
import*as$from'.assets/jquery.js'；
导出类API{
ServerUrl=''；
类型={
Day:“Day”，
夜：“夜”
};
天数={
星期一：“星期一”，
星期二：“星期二”，
星期三：“星期三”，
星期四：“星期四”，
星期五：“星期五”，
星期六：“星期六”，
星期日：“星期日”
};
MintTemperature=parseFloat（'5.0'）；
MaxTemperature=parseFloat（'30.0'）；
最大开关数=5；
时间
今日；
日温；
夜间温度；
电流温度；
目标温度；
编程状态；
程序：any={}；
构造函数（）{
this.Program[本.天.星期一]=[]；
this.Program[本.天.周二]=[]；
this.Program[本.天.周三]=[]；
this.Program[本.天.周四]=[]；
this.Program[本.天.周五]=[]；
this.Program[本.天.周六]=[]；
this.Program[this.Days.Sunday]=[]；
}
/*检索日计划
*/
getProgram（天）{
返回此。程序[日期]；
}
/*对加热时段（打开加热时的时段）进行排序并合并重叠的时段
*/
sortMergeProgram（天）{
让program=this.getProgram（天）；
程序排序（函数（a，b）{
返回this.parseTime（a[0]）-this.parseTime（b[0]）
});
for（设i=0；i=this.parseTime（程序[i+1][0]））{
let start=（程序[i][0]）；
设end=（this.parseTime（program[i][1]）>this.parseTime（program[i+1][1]）？program[i][1]：program[i+1][1]；
节目。
var ServerUrl = '';

Type = {
    Day : 'day',
    Night : 'night'
};

Days = {
    Monday : 'Monday',
    Tuesday : 'Tuesday',
    Wednesday : 'Wednesday',
    Thursday : 'Thursday',
    Friday : 'Friday',
    Saturday : 'Saturday',
    Sunday : 'Sunday'
};

var MinTemperature = parseFloat(5.0);
var MaxTemperature = parseFloat(30.0);
var MaxSwitches = 5;

var Time;
var CurrentDay;
var DayTemperature;
var NightTemperature;
var CurrentTemperature;
var TargetTemperature;
var ProgramState;

var Program = {};
Program[Days.Monday]    = [];
Program[Days.Tuesday]   = [];
Program[Days.Wednesday] = [];
Program[Days.Thursday]  = [];
Program[Days.Friday]    = [];
Program[Days.Saturday]  = [];
Program[Days.Sunday]    = [];

/* Retrive day program
*/
function getProgram(day) {
    return Program[day];
}

/* Sorts the heating periods (the periods when the heating is on) and merges overlapping ones
*/
function sortMergeProgram(day) {
    var program = getProgram(day);
    program.sort(function(a, b){return parseTime(a[0])-parseTime(b[0])});
    for (var i = 0; i < program.length - 1; i++) {
        if (parseTime(program[i][1]) >= parseTime(program[i+1][0])) {
            var start = (program[i][0]);
            var end = (parseTime(program[i][1]) > parseTime(program[i+1][1])) ? program[i][1] : program[i+1][1];
            program.splice(i, 2);
            program.push([start, end]);
            sortMergeProgram(day);
            break;
        }
    }
}

/* Retrieves all data from the server except for weekProgram
*/
function get(attribute_name, xml_tag) {
    return requestData(
        "/"+attribute_name,
        function(data) {
            return $(data).find(xml_tag).text();
        }
    );
}

/* Retrieves the week program
*/
function getWeekProgram() {
    return requestData(
        '/weekProgram',
        function(data) {
            $(data).find('day').each(function() {
                var day = $(this).attr('name');
                Program[day] = [];
                $(this).find('switch').each(function() {
                    if ($(this).attr('state') == 'on') {
                        if ($(this).attr('type') == Type.Day) {
                            getProgram(day).push([$(this).text(), '00:00']);
                        } else {
                            getProgram(day)[getProgram(day).length - 1][1] = $(this).text();
                        }
                    }
                })
            });
            return Program;
        }
    );
}

<thermostat><current_day>Thursday</current_day>
<time>23:32</time>
<current_temperature>16.0</current_temperature>
<target_temperature>16.0</target_temperature>
<day_temperature>22.0</day_temperature>
<night_temperature>19.0</night_temperature>
<week_program_state>off</week_program_state>
<week_program state="off">
  <day name="Monday">
    <switch type="day" state="off">00:00</switch>
    <switch type="day" state="off">00:00</switch>
    <switch type="day" state="off">00:00</switch>
    <switch type="night" state="off">00:00</switch>
    <switch type="night" state="off">00:00</switch>
    <switch type="night" state="off">00:00</switch>
    <switch type="day" state="on">05:00</switch>
    <switch type="night" state="on">08:00</switch>
    <switch type="day" state="on">12:00</switch>
    <switch type="night" state="on">14:00</switch>
  </day>
  <day name="Tuesday">
    <switch type="day" state="off">00:00</switch>
    <switch type="day" state="off">00:00</switch>
    <switch type="day" state="off">00:00</switch>
    <switch type="day" state="off">00:00</switch>
    <switch type="day" state="off">00:00</switch>
    <switch type="night" state="off">00:00</switch>
    <switch type="night" state="off">00:00</switch>
    <switch type="night" state="off">00:00</switch>
    <switch type="night" state="off">00:00</switch>
    <switch type="night" state="off">00:00</switch>
  </day>